@wordpress/block-editor
Version:
108 lines (105 loc) • 4.27 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = BlockToolbar;
var _data = require("@wordpress/data");
var _element = require("@wordpress/element");
var _blockToolbarMenu = _interopRequireDefault(require("./block-toolbar-menu"));
var _blockControls = _interopRequireDefault(require("../block-controls"));
var _blockMover = _interopRequireDefault(require("../block-mover"));
var _ungroupButton = _interopRequireDefault(require("../ungroup-button"));
var _blockSettings = require("../block-settings");
var _store = require("../../store");
var _jsxRuntime = require("react/jsx-runtime");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const REMOVE_EMPTY_PARENT_BLOCKS = ['core/buttons', 'core/columns', 'core/social-links'];
function BlockToolbar({
anchorNodeRef
}) {
const {
rootClientId,
blockClientId,
isSelected,
isValidAndVisual,
isStackedHorizontally,
parentBlockName,
parentNumberOfInnerBlocks
} = (0, _data.useSelect)(select => {
const {
getBlockListSettings,
getBlockMode,
getBlockName,
getBlockCount,
getBlockRootClientId,
getSelectedBlockClientIds,
isBlockValid
} = select(_store.store);
const selectedBlockClientIds = getSelectedBlockClientIds();
const selectedBlockClientId = selectedBlockClientIds[0];
const blockRootClientId = getBlockRootClientId(selectedBlockClientId);
const blockListSettings = getBlockListSettings(blockRootClientId);
const orientation = blockListSettings?.orientation;
const isBlockStackedHorizontally = orientation === 'horizontal';
const parentName = getBlockName(blockRootClientId);
const numberOfInnerBlocks = getBlockCount(blockRootClientId);
return {
rootClientId: blockRootClientId,
blockClientId: selectedBlockClientId,
isSelected: selectedBlockClientIds.length > 0,
isStackedHorizontally: isBlockStackedHorizontally,
parentBlockName: parentName,
parentNumberOfInnerBlocks: numberOfInnerBlocks,
isValidAndVisual: selectedBlockClientIds.length === 1 ? isBlockValid(selectedBlockClientIds[0]) && getBlockMode(selectedBlockClientIds[0]) === 'visual' : false
};
}, []);
const {
removeBlock
} = (0, _data.useDispatch)(_store.store);
const onRemove = (0, _element.useCallback)(() => {
// Temp: remove parent block for specific cases where they don't
// have inner blocks, ideally we should match the behavior as in
// the Web editor and show a placeholder instead of removing the parent.
if (REMOVE_EMPTY_PARENT_BLOCKS.includes(parentBlockName) && parentNumberOfInnerBlocks === 1) {
removeBlock(rootClientId);
return;
}
removeBlock(blockClientId);
}, [blockClientId, parentBlockName, parentNumberOfInnerBlocks, removeBlock, rootClientId]);
if (!isSelected) {
return null;
}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
children: isValidAndVisual && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockSettings.BlockSettingsButton.Slot, {
children: (fills = [null]) => {
if (!fills?.length > 0) {
return null;
}
return fills[0];
}
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockControls.default.Slot, {
group: "block"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockControls.default.Slot, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockControls.default.Slot, {
group: "inline"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockControls.default.Slot, {
group: "other"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ungroupButton.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockMover.default, {
clientIds: [blockClientId],
isStackedHorizontally: isStackedHorizontally
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockToolbarMenu.default, {
clientId: blockClientId,
isStackedHorizontally: isStackedHorizontally,
onDelete: onRemove,
anchorNodeRef: anchorNodeRef
})]
})
});
}
//# sourceMappingURL=index.native.js.map