@atlaskit/renderer
Version:
Renderer component
46 lines • 1.52 kB
JavaScript
import React, { createContext, useState, useContext, useMemo, useRef, useCallback } from 'react';
const AnnotationHoverStateContext = /*#__PURE__*/createContext({
isWithinRange: false
});
const AnnotationHoverDispatchContext = /*#__PURE__*/createContext({
cancelTimeout: () => {},
initiateTimeout: () => {},
setIsWithinRange: () => {}
});
export const AnnotationHoverContext = ({
children
}) => {
const [isWithinRange, setIsWithinRange] = useState(false);
const timeoutHandler = useRef();
const cancelTimeout = useCallback(() => {
if (timeoutHandler) {
clearTimeout(timeoutHandler.current);
}
}, [timeoutHandler]);
const initiateTimeout = useCallback(() => {
if (isWithinRange) {
timeoutHandler.current = setTimeout(() => {
setIsWithinRange(false);
}, 500);
}
}, [isWithinRange]);
const stateData = useMemo(() => ({
isWithinRange
}), [isWithinRange]);
const dispatchData = useMemo(() => ({
cancelTimeout,
initiateTimeout,
setIsWithinRange
}), [cancelTimeout, initiateTimeout, setIsWithinRange]);
return /*#__PURE__*/React.createElement(AnnotationHoverStateContext.Provider, {
value: stateData
}, /*#__PURE__*/React.createElement(AnnotationHoverDispatchContext.Provider, {
value: dispatchData
}, children));
};
export const useAnnotationHoverContext = () => {
return useContext(AnnotationHoverStateContext);
};
export const useAnnotationHoverDispatch = () => {
return useContext(AnnotationHoverDispatchContext);
};