Skip to content

Experience-Monks/react-hooks

Repository files navigation

@jam3/react-hooks

Repository for public react hooks

NPM JavaScript Style Guide

Hooks List

  • use-intersection-observer: Observes a DOM Element
  • use-mouse-position: Mouse Position [ {x , y} ]
  • use-on-hover: Detects hover events and accepts two callbacks for in & out
  • use-scroll-direction: Scroll direction [top | up | down]
  • use-scroll-progress: Scroll Progress [0-100]
  • use-scroll-to-top: Scrolls To Top [fn]
  • use-window-size: Window Size [ {innerHeight , innerWidth} ]

Install

NPM

npm install @jam3/react-hooks
yarn add @jam3/react-hooks

Usage

Sample Usage for one of the hooks

import React from "react";
import { useMousePosition } from "@jam3/react-hooks";

const Component = () => {
  const { x, y } = useMousePosition();

  return (
    <div>
      Mouse position x: {x}
      <br />
      Mouse position y: {y}
    </div>
  );
};

For more information, please refer to Usage in our documentation.

Release

Steps:

  1. git checkout master; git pull origin master
  2. Document the changelog and bump the package.json version
  3. npm run build
  4. npm publish

By pushing master, Netlify will run npm run deploy and it will re-deply the docs here

Contributing

Please make sure to read the contributing guide before making a pull request.

Changelog

Detailed changes for each release are documented in the release notes.

What next

  • Automate new hooks creation and publishing
  • Improve docs and examples
  • Typescript support
  • SSR Support
  • Conventional Commit Specifications

License

MIT © Jam3


This hook is created using create-react-hook.

About

No description, website, or topics provided.

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published