@wordpress/block-editor
Version:
52 lines (51 loc) • 1.79 kB
JavaScript
/**
* WordPress dependencies
*/
import { useSelect, useDispatch } from '@wordpress/data';
import { useRefEffect } from '@wordpress/compose';
/**
* Internal dependencies
*/
import { store as blockEditorStore } from '../../store';
import { getBlockClientId } from '../../utils/dom';
export default function useClickSelection() {
const {
selectBlock
} = useDispatch(blockEditorStore);
const {
isSelectionEnabled,
getBlockSelectionStart,
hasMultiSelection
} = useSelect(blockEditorStore);
return useRefEffect(node => {
function onMouseDown(event) {
// The main button.
// https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
if (!isSelectionEnabled() || event.button !== 0) {
return;
}
const startClientId = getBlockSelectionStart();
const clickedClientId = getBlockClientId(event.target);
if (event.shiftKey) {
if (startClientId !== clickedClientId) {
node.contentEditable = true;
// Firefox doesn't automatically move focus.
node.focus();
}
} else if (hasMultiSelection()) {
// Allow user to escape out of a multi-selection to a
// singular selection of a block via click. This is handled
// here since focus handling excludes blocks when there is
// multiselection, as focus can be incurred by starting a
// multiselection (focus moved to first block's multi-
// controls).
selectBlock(clickedClientId);
}
}
node.addEventListener('mousedown', onMouseDown);
return () => {
node.removeEventListener('mousedown', onMouseDown);
};
}, [selectBlock, isSelectionEnabled, getBlockSelectionStart, hasMultiSelection]);
}
//# sourceMappingURL=use-click-selection.js.map