@wordpress/block-editor
Version:
54 lines (50 loc) • 1.3 kB
JavaScript
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useIsHovered = useIsHovered;
var _compose = require("@wordpress/compose");
var _data = require("@wordpress/data");
var _store = require("../../../store");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/*
* Adds `is-hovered` class when the block is hovered and in navigation or
* outline mode.
*/
function useIsHovered({
clientId
}) {
const {
hoverBlock
} = (0, _data.useDispatch)(_store.store);
function listener(event) {
if (event.defaultPrevented) {
return;
}
const action = event.type === 'mouseover' ? 'add' : 'remove';
event.preventDefault();
event.currentTarget.classList[action]('is-hovered');
if (action === 'add') {
hoverBlock(clientId);
} else {
hoverBlock(null);
}
}
return (0, _compose.useRefEffect)(node => {
node.addEventListener('mouseout', listener);
node.addEventListener('mouseover', listener);
return () => {
node.removeEventListener('mouseout', listener);
node.removeEventListener('mouseover', listener);
// Remove class in case it lingers.
node.classList.remove('is-hovered');
hoverBlock(null);
};
}, []);
}
//# sourceMappingURL=use-is-hovered.js.map
;