@wordpress/block-editor
Version:
62 lines (61 loc) • 2.22 kB
JavaScript
// packages/block-editor/src/components/block-parent-selector/index.js
import { ToolbarButton } from "@wordpress/components";
import { useSelect, useDispatch } from "@wordpress/data";
import { __, sprintf } from "@wordpress/i18n";
import { useRef } from "@wordpress/element";
import useBlockDisplayInformation from "../use-block-display-information";
import BlockIcon from "../block-icon";
import { useShowHoveredOrFocusedGestures } from "../block-toolbar/utils";
import { store as blockEditorStore } from "../../store";
import { unlock } from "../../lock-unlock";
import { jsx } from "react/jsx-runtime";
function BlockParentSelector() {
const { selectBlock } = useDispatch(blockEditorStore);
const { parentClientId } = useSelect((select) => {
const {
getBlockParents,
getSelectedBlockClientId,
getParentSectionBlock
} = unlock(select(blockEditorStore));
const selectedBlockClientId = getSelectedBlockClientId();
const parentSection = getParentSectionBlock(selectedBlockClientId);
const parents = getBlockParents(selectedBlockClientId);
const _parentClientId = parentSection ?? parents[parents.length - 1];
return {
parentClientId: _parentClientId
};
}, []);
const blockInformation = useBlockDisplayInformation(parentClientId);
const nodeRef = useRef();
const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures({
ref: nodeRef,
highlightParent: true
});
return /* @__PURE__ */ jsx(
"div",
{
className: "block-editor-block-parent-selector",
ref: nodeRef,
...showHoveredOrFocusedGestures,
children: /* @__PURE__ */ jsx(
ToolbarButton,
{
className: "block-editor-block-parent-selector__button",
onClick: () => selectBlock(parentClientId),
label: sprintf(
/* translators: %s: Name of the block's parent. */
__("Select parent block: %s"),
blockInformation?.title
),
showTooltip: true,
icon: /* @__PURE__ */ jsx(BlockIcon, { icon: blockInformation?.icon })
}
)
},
parentClientId
);
}
export {
BlockParentSelector as default
};
//# sourceMappingURL=index.js.map