search

sandiiarov / use-events

🍭 Event hooks
https://sandiiarov.github.io/use-events
492 stars 16 forks source link

feat: 🎸 add helper to call all callbacks #126

Closed therealparmesh closed 5 years ago

therealparmesh commented 5 years ago

Addresses https://github.com/sandiiarov/use-events/issues/113. I could use some help with the types. I am not sure what the best interface for this helper is. 😄

Usage

import * as React from 'react';
import { useHover, callAllEventHandlers } from 'use-events';

const Example = () => {
  const [isHovered, bind] = useHover();

  return (
    <div
      onMouseEnter={callAllEventHandlers<
        React.MouseEventHandler<HTMLDivElement>,
        React.MouseEvent<HTMLDivElement>
      >(bind.onMouseEnter, console.log)}
      onMouseLeave={callAllEventHandlers<
        React.MouseEventHandler<HTMLDivElement>,
        React.MouseEvent<HTMLDivElement>
      >(bind.onMouseLeave, console.log)}
    >
      You are {isHovered ? 'hovering' : 'not hovering'} this div
    </div>
  );
};