https://github.com/marsidev/react-hooks
A collection of common React hooks. Made with TypeScript.
https://github.com/marsidev/react-hooks
Last synced: 19 days ago
JSON representation
A collection of common React hooks. Made with TypeScript.
- Host: GitHub
- URL: https://github.com/marsidev/react-hooks
- Owner: marsidev
- License: mit
- Created: 2022-08-12T23:55:16.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-04-29T14:30:07.000Z (almost 2 years ago)
- Last Synced: 2025-03-13T19:41:47.568Z (about 1 month ago)
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/@marsidev/react-hooks
- Size: 92.8 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
@marsidev/react-hooks
## Introduction
This is a collection of common React Hooks that I use in my React projects.
Bootstraped with [antfu/starter-ts].
Inspired by [usehooks-ts], [@restart/hooks], and [@chakra-ui/hooks].
## Installation
- Using npm
```bash
npm i @marsidev/react-hooks
```
- Using pnpm
```bash
pnpm add @marsidev/react-hooks
```
- Using yarn
```bash
yarn add @marsidev/react-hooks
```
## Example
```jsx
import { useScrollY } from '@marsidev/react-hooks'
import { Header, Footer, ScrollToTop } from '~/components'
export const Layout = ({ children }) => {
const { offsetPassed } = useScrollY(400)
return (
{children}
{offsetPassed && }
)
}
```
## Available Hooks
- `useCopyElementToClipboard`
- `useCopyToClipboard`
- `useInput`
- `useRendered`
- `useSafeLayoutEffect`
- `useScrollY`
- `useWindowSize`
[antfu/starter-ts]: https://github.com/antfu/starter-ts
[usehooks-ts]: https://usehooks-ts.com
[@restart/hooks]: https://www.npmjs.com/package/@restart/hooks
[@chakra-ui/hooks]: https://github.com/chakra-ui/chakra-ui/tree/main/packages/hooks