How to use the @magento/peregrine.useEventListener function in @magento/peregrine

const classes = mergeClasses(defaultClasses, props.classes);
    const toggleClass = isOpen ? classes.dropdown_active : classes.dropdown;

    const handleKebabClick = useCallback(() => {
        setIsOpen(!isOpen);
    }, [isOpen]);
    const handleOutsideKebabClick = useCallback(event => {
        // Ensure we're truly outside of the kebab.
        if (!kebabRef.current.contains(event.target)) {
            setIsOpen(false);
        }
    }, []);

    useEventListener(document, 'mousedown', handleOutsideKebabClick);
    useEventListener(document, 'touchend', handleOutsideKebabClick);

    return (
        <div>
            <button>
                
            </button>
            <ul>{children}</ul>
        </div>
    );
};

const [isOpen, setIsOpen] = useState(false);

    const classes = mergeClasses(defaultClasses, props.classes);
    const toggleClass = isOpen ? classes.dropdown_active : classes.dropdown;

    const handleKebabClick = useCallback(() => {
        setIsOpen(!isOpen);
    }, [isOpen]);
    const handleOutsideKebabClick = useCallback(event => {
        // Ensure we're truly outside of the kebab.
        if (!kebabRef.current.contains(event.target)) {
            setIsOpen(false);
        }
    }, []);

    useEventListener(document, 'mousedown', handleOutsideKebabClick);
    useEventListener(document, 'touchend', handleOutsideKebabClick);

    return (
        <div>
            <button>
                
            </button>
            <ul>{children}</ul>
        </div>
    );
};