@wordpress/block-library
Version:
Block library for the WordPress editor.
99 lines (98 loc) • 3.17 kB
JavaScript
// packages/block-library/src/paragraph/use-enter.js
import { useRef } from "@wordpress/element";
import { useRefEffect } from "@wordpress/compose";
import { ENTER } from "@wordpress/keycodes";
import { useSelect, useDispatch, useRegistry } from "@wordpress/data";
import { store as blockEditorStore } from "@wordpress/block-editor";
import {
hasBlockSupport,
createBlock,
cloneBlock,
getDefaultBlockName
} from "@wordpress/blocks";
function useOnEnter(props) {
const { batch } = useRegistry();
const { moveBlocksToPosition, replaceBlocks, selectionChange } = useDispatch(blockEditorStore);
const {
getBlockRootClientId,
getBlockIndex,
getBlockOrder,
getBlockName,
getBlock,
canInsertBlockType
} = useSelect(blockEditorStore);
const propsRef = useRef(props);
propsRef.current = props;
return useRefEffect((element) => {
function onKeyDown(event) {
if (event.defaultPrevented) {
return;
}
if (event.keyCode !== ENTER) {
return;
}
const { content, clientId } = propsRef.current;
if (content.length) {
return;
}
const wrapperClientId = getBlockRootClientId(clientId);
if (!hasBlockSupport(
getBlockName(wrapperClientId),
"__experimentalOnEnter",
false
)) {
return;
}
const order = getBlockOrder(wrapperClientId);
const position = order.indexOf(clientId);
if (position === order.length - 1) {
let newWrapperClientId = wrapperClientId;
while (!canInsertBlockType(
getBlockName(clientId),
getBlockRootClientId(newWrapperClientId)
)) {
newWrapperClientId = getBlockRootClientId(newWrapperClientId);
}
if (typeof newWrapperClientId === "string") {
event.preventDefault();
moveBlocksToPosition(
[clientId],
wrapperClientId,
getBlockRootClientId(newWrapperClientId),
getBlockIndex(newWrapperClientId) + 1
);
}
return;
}
const defaultBlockName = getDefaultBlockName();
const wrapperBlockName = getBlockName(wrapperClientId);
const grandparentClientId = getBlockRootClientId(wrapperClientId);
if (!canInsertBlockType(defaultBlockName, grandparentClientId) || !canInsertBlockType(wrapperBlockName, grandparentClientId)) {
return;
}
event.preventDefault();
const wrapperBlock = getBlock(wrapperClientId);
const head = cloneBlock({
...wrapperBlock,
innerBlocks: wrapperBlock.innerBlocks.slice(0, position)
});
const middle = createBlock(defaultBlockName);
const tail = cloneBlock({
...wrapperBlock,
innerBlocks: wrapperBlock.innerBlocks.slice(position + 1)
});
batch(() => {
replaceBlocks(wrapperClientId, [head, middle, tail]);
selectionChange(middle.clientId);
});
}
element.addEventListener("keydown", onKeyDown);
return () => {
element.removeEventListener("keydown", onKeyDown);
};
}, []);
}
export {
useOnEnter
};
//# sourceMappingURL=use-enter.mjs.map