UNPKG

@wordpress/block-editor

Version:
107 lines (104 loc) 3.68 kB
/** * WordPress dependencies */ import { createSlotFill, MenuGroup, __experimentalStyleProvider as StyleProvider } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; /** * Internal dependencies */ import { useConvertToGroupButtonProps, ConvertToGroupButton } from '../convert-to-group-buttons'; import { BlockLockMenuItem, useBlockLock } from '../block-lock'; import { store as blockEditorStore } from '../../store'; import BlockModeToggle from '../block-settings-menu/block-mode-toggle'; import { ModifyContentLockMenuItem } from '../content-lock'; import { BlockRenameControl, useBlockRename } from '../block-rename'; import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; const { Fill, Slot } = createSlotFill('BlockSettingsMenuControls'); const BlockSettingsMenuControlsSlot = ({ fillProps, clientIds = null }) => { const { selectedBlocks, selectedClientIds, isContentOnly } = useSelect(select => { const { getBlockNamesByClientId, getSelectedBlockClientIds, getBlockEditingMode } = select(blockEditorStore); const ids = clientIds !== null ? clientIds : getSelectedBlockClientIds(); return { selectedBlocks: getBlockNamesByClientId(ids), selectedClientIds: ids, isContentOnly: getBlockEditingMode(ids[0]) === 'contentOnly' }; }, [clientIds]); const { canLock } = useBlockLock(selectedClientIds[0]); const { canRename } = useBlockRename(selectedBlocks[0]); const showLockButton = selectedClientIds.length === 1 && canLock && !isContentOnly; const showRenameButton = selectedClientIds.length === 1 && canRename && !isContentOnly; // Check if current selection of blocks is Groupable or Ungroupable // and pass this props down to ConvertToGroupButton. const convertToGroupButtonProps = useConvertToGroupButtonProps(selectedClientIds); const { isGroupable, isUngroupable } = convertToGroupButtonProps; const showConvertToGroupButton = (isGroupable || isUngroupable) && !isContentOnly; return /*#__PURE__*/_jsx(Slot, { fillProps: { ...fillProps, selectedBlocks, selectedClientIds }, children: fills => { if (!fills?.length > 0 && !showConvertToGroupButton && !showLockButton) { return null; } return /*#__PURE__*/_jsxs(MenuGroup, { children: [showConvertToGroupButton && /*#__PURE__*/_jsx(ConvertToGroupButton, { ...convertToGroupButtonProps, onClose: fillProps?.onClose }), showLockButton && /*#__PURE__*/_jsx(BlockLockMenuItem, { clientId: selectedClientIds[0] }), showRenameButton && /*#__PURE__*/_jsx(BlockRenameControl, { clientId: selectedClientIds[0] }), fills, selectedClientIds.length === 1 && /*#__PURE__*/_jsx(ModifyContentLockMenuItem, { clientId: selectedClientIds[0], onClose: fillProps?.onClose }), fillProps?.count === 1 && !isContentOnly && /*#__PURE__*/_jsx(BlockModeToggle, { clientId: fillProps?.firstBlockClientId, onToggle: fillProps?.onClose })] }); } }); }; /** * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-settings-menu-controls/README.md * * @param {Object} props Fill props. * @return {Element} Element. */ function BlockSettingsMenuControls({ ...props }) { return /*#__PURE__*/_jsx(StyleProvider, { document: document, children: /*#__PURE__*/_jsx(Fill, { ...props }) }); } BlockSettingsMenuControls.Slot = BlockSettingsMenuControlsSlot; export default BlockSettingsMenuControls; //# sourceMappingURL=index.js.map