https://github.com/commitd/hooks
Committed React Hooks library
https://github.com/commitd/hooks
Last synced: 5 months ago
JSON representation
Committed React Hooks library
- Host: GitHub
- URL: https://github.com/commitd/hooks
- Owner: commitd
- License: mit
- Created: 2020-11-06T13:00:32.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-07-10T10:19:06.000Z (almost 3 years ago)
- Last Synced: 2025-09-30T06:53:36.458Z (9 months ago)
- Language: TypeScript
- Homepage: hooks.committed.software
- Size: 2.48 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Committed Hooks
Committed hooks library
[](https://committed.io)
[](https://sonarcloud.io/dashboard?id=commitd_hooks)
[](https://sonarcloud.io/dashboard?id=commitd_hooks)
For documentation see
## Install
```bash
yarn add @committed/hooks
```
## Usage
```tsx
import * as React from 'react'
import { useHook } from '@committed/hooks'
// Or
// import { useHook } from '@committed/hooks/useHook'
const Example = (props) => {
const { hook } = useHook()
// ...
return
}
```
## Development
The main build is performed using Rollup:
```bash
yarn build
```
We use storybook to develop and document the components, this is run in development using
```bash
yarn storybook
```
There is also an example folder that can be used to test the library in it's built form. The recommended workflow is to run two terminals, in the first run
```bash
yarn start
```
This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.
Then run either Storybook or the example playground:
### Storybook
Run inside another terminal:
```bash
yarn storybook
```
This loads the stories from `./stories`.
> NOTE: Stories should reference the components as if using the library, similar to the example playground. This means importing from the root project directory. This has been aliased in the tsconfig and the storybook webpack config as a helper.
### Example
Then run the example inside another:
```bash
cd example
yarn # if first time
yarn start
```
The default example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure `start` is running in watch mode like we recommend above. **No symlinking required**, we use [Parcel's aliasing](https://parceljs.org/module_resolution.html#aliases).
### Test+
To run tests, use `yarn test` and formatting with `yarn format` and linting with `yarn lint`.
### Bundle analysis
Calculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `yarn size` and visualize it with `yarn analyze`.
#### React Testing Library
Import `setupTests.tsx` in your test files to use `react-testing-library`.
## Continuous Integration
### GitHub Actions
Two actions are added by default:
- `build` which installs deps w/ cache, lints, tests, and builds.
- `release` triggered on release with (commented) options to publish and deploy storybook
- `size` which comments cost comparison of your library on every pull request using [size-limit](https://github.com/ai/size-limit)
## License
[MIT](/LICENSE) - © Committed Software 2020-2022