mirror of
https://github.com/streamich/react-use.git
synced 2026-01-18 14:06:52 +00:00
Merge pull request #22 from maxzitron/docs/add-useHover-example
docs: add useHover demo link
This commit is contained in:
Va Da
GitHub
commit
749afe6ea9
104
README.md
104
README.md
@ -27,70 +27,66 @@
|
||||
<br />
|
||||
</div>
|
||||
|
||||
|
||||
## Reference
|
||||
|
||||
- [__Sensors__](./docs/Sensors.md)
|
||||
- [`useBattery`](./docs/useBattery.md) — tracks device battery state. [![][img-demo]](https://codesandbox.io/s/qlvn662zww)
|
||||
- [`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. [![][img-demo]](https://codesandbox.io/s/m7ln22668)
|
||||
<br/>
|
||||
<br/>
|
||||
- [__UI__](./docs/UI.md)
|
||||
- [`useAudio`](./docs/useAudio.md) — plays audio and exposes its controls. [![][img-demo]](https://codesandbox.io/s/5v7q47knwl)
|
||||
- [`useSpeech`](./docs/useSpeech.md) — synthesizes speech from a text string. [![][img-demo]](https://codesandbox.io/s/n090mqz69m)
|
||||
<br/>
|
||||
<br/>
|
||||
- [__Animations__](./docs/Animations.md)
|
||||
- [`useRaf`](./docs/useRaf.md) — re-renders component on each `reaquestAnimationFrame`.
|
||||
- [`useSpring`](./docs/useSpring.md) — interpolates number over time according to spring dynamics.
|
||||
- [`useTimeout`](./docs/useTimeout.md) — returns true after a timeout.
|
||||
- [`useTween`](./docs/useTween.md) — re-renders component, while tweening a number from 0 to 1. [![][img-demo]](https://codesandbox.io/s/52990wwzyl)
|
||||
<br/>
|
||||
<br/>
|
||||
- [__Side-effects__](./docs/Side-effects.md)
|
||||
- [`useAsync`](./docs/useAsync.md) — resolves an `async` function.
|
||||
- [`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/>
|
||||
- [__Lifecycles__](./docs/Lifecycles.md)
|
||||
- [`useLifecycles`](./docs/useLifecycles.md) — calls `mount` and `unmount` callbacks.
|
||||
- [`useLogger`](./docs/useLogger.md) — logs in console as component goes though life-cycles.
|
||||
- [`useMount`](./docs/useMount.md) — calls `mount` callbacks.
|
||||
- [`useUnmount`](./docs/useUnmount.md) — calls `unmount` callbacks.
|
||||
<br/>
|
||||
<br/>
|
||||
- [__State__](./docs/State.md)
|
||||
- [`useObservable`](./docs/useObservable.md) — tracks latest value of an `Observable`.
|
||||
- [`useSetState`](./docs/useSetState.md) — creates `setState` method which works like `this.setState`. [![][img-demo]](https://codesandbox.io/s/n75zqn1xp0)
|
||||
- [`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/>
|
||||
|
||||
- [**Sensors**](./docs/Sensors.md)
|
||||
- [`useBattery`](./docs/useBattery.md) — tracks device battery state. [![][img-demo]](https://codesandbox.io/s/qlvn662zww)
|
||||
- [`useGeolocation`](./docs/useGeolocation.md) — tracks geo location state of user's device.
|
||||
- [`useHover`](./docs/useHover.md) — tracks mouse hover state of some element. [![][img-demo]](https://codesandbox.io/s/zpn583rvx)
|
||||
- [`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. [![][img-demo]](https://codesandbox.io/s/m7ln22668)
|
||||
<br/>
|
||||
<br/>
|
||||
- [**UI**](./docs/UI.md)
|
||||
- [`useAudio`](./docs/useAudio.md) — plays audio and exposes its controls. [![][img-demo]](https://codesandbox.io/s/5v7q47knwl)
|
||||
- [`useSpeech`](./docs/useSpeech.md) — synthesizes speech from a text string. [![][img-demo]](https://codesandbox.io/s/n090mqz69m)
|
||||
<br/>
|
||||
<br/>
|
||||
- [**Animations**](./docs/Animations.md)
|
||||
- [`useRaf`](./docs/useRaf.md) — re-renders component on each `reaquestAnimationFrame`.
|
||||
- [`useSpring`](./docs/useSpring.md) — interpolates number over time according to spring dynamics.
|
||||
- [`useTimeout`](./docs/useTimeout.md) — returns true after a timeout.
|
||||
- [`useTween`](./docs/useTween.md) — re-renders component, while tweening a number from 0 to 1. [![][img-demo]](https://codesandbox.io/s/52990wwzyl)
|
||||
<br/>
|
||||
<br/>
|
||||
- [**Side-effects**](./docs/Side-effects.md)
|
||||
- [`useAsync`](./docs/useAsync.md) — resolves an `async` function.
|
||||
- [`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/>
|
||||
- [**Lifecycles**](./docs/Lifecycles.md)
|
||||
- [`useLifecycles`](./docs/useLifecycles.md) — calls `mount` and `unmount` callbacks.
|
||||
- [`useLogger`](./docs/useLogger.md) — logs in console as component goes though life-cycles.
|
||||
- [`useMount`](./docs/useMount.md) — calls `mount` callbacks.
|
||||
- [`useUnmount`](./docs/useUnmount.md) — calls `unmount` callbacks.
|
||||
<br/>
|
||||
<br/>
|
||||
- [**State**](./docs/State.md)
|
||||
- [`useObservable`](./docs/useObservable.md) — tracks latest value of an `Observable`.
|
||||
- [`useSetState`](./docs/useSetState.md) — creates `setState` method which works like `this.setState`. [![][img-demo]](https://codesandbox.io/s/n75zqn1xp0)
|
||||
- [`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.
|
||||
|
||||
|
||||
[img-demo]: https://img.shields.io/badge/demo-%20%20%20%F0%9F%9A%80-green.svg
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user