@wordpress/block-library
Version:
Block library for the WordPress editor.
60 lines (59 loc) • 1.83 kB
JavaScript
// packages/block-library/src/list-item/hooks/use-multi-select-tab.js
import { useRefEffect } from "@wordpress/compose";
import { TAB } from "@wordpress/keycodes";
import { store as blockEditorStore } from "@wordpress/block-editor";
import { useSelect, useRegistry } from "@wordpress/data";
import { indentListItems, outdentListItems } from "../utils.mjs";
function useMultiSelectTab(clientId) {
const registry = useRegistry();
const isActive = useSelect(
(select) => {
const {
hasMultiSelection,
getMultiSelectedBlockClientIds,
getBlockName
} = select(blockEditorStore);
if (!hasMultiSelection()) {
return false;
}
const clientIds = getMultiSelectedBlockClientIds();
return clientIds[0] === clientId && clientIds.every(
(id) => getBlockName(id) === "core/list-item"
);
},
[clientId]
);
return useRefEffect(
(element) => {
if (!isActive) {
return;
}
function onKeyDown(event) {
const { keyCode, shiftKey, altKey, metaKey, ctrlKey } = event;
if (keyCode !== TAB || event.defaultPrevented || altKey || metaKey || ctrlKey) {
return;
}
if (!event.target.contains(element)) {
return;
}
if (shiftKey) {
if (outdentListItems(registry)) {
event.preventDefault();
}
} else if (indentListItems(registry)) {
event.preventDefault();
}
}
const { ownerDocument } = element;
ownerDocument.addEventListener("keydown", onKeyDown, true);
return () => {
ownerDocument.removeEventListener("keydown", onKeyDown, true);
};
},
[isActive, registry]
);
}
export {
useMultiSelectTab as default
};
//# sourceMappingURL=use-multi-select-tab.mjs.map