Introduction

• useClickInside listens for any click inside of specific element.
• Helps you detect any click event inside of specific element
• You can call any function when a user clicked inside of specific element

const clicked = useClickInside({ref, callback});

Getting Started

• You need to import useClickInside .

From Collection

import { useClickInside } from "@reactivers/hooks";

From Package

import { useClickInside } from "@reactivers/use-click-inside";

Interfaces

Props

interface IUseClickInside {
    //Any element's ref object
    ref: MutableRefObject<any>;

    //Triggered on click inside
    callback: (event: MouseEvent | TouchEvent) => void;

    //For each click it tracks last state.
    //If sets True it useses useState to track cliced boolean value. Otherwise uses useRef
    withState?: boolean; // Default = False

    //Event options. If you won't call preventDefault you don't need to set this.
    passive?: boolean;
}

Returns

    interface IUseClickInsideReturns {
        clicked: boolean
    }

Example

Run Example