: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
className: "block-editor-list-view-block-select-button__title",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, {
}), blockInformation?.anchor && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
className: "block-editor-list-view-block-select-button__anchor-wrapper",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalTruncate, {
className: "block-editor-list-view-block-select-button__anchor",
children: blockInformation.anchor
}), positionLabel && isSticky && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, {
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
}), images.length ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
className: "block-editor-list-view-block-select-button__images",
children: images.map((image, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
className: "block-editor-list-view-block-select-button__image",
backgroundImage: `url(${image.url})`,
zIndex: images.length - index // Ensure the first image is on top, and subsequent images are behind.
}) : null, shouldShowLockIcon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
className: "block-editor-list-view-block-select-button__lock",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
/* harmony default export */ const block_select_button = ((0,external_wp_element_namespaceObject.forwardRef)(ListViewBlockSelectButton));
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/block-contents.js
const ListViewBlockContents = (0,external_wp_element_namespaceObject.forwardRef)(({
selectedBlockInBlockEditor
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
blockMovingClientId: hasBlockMovingClientId(),
selectedBlockInBlockEditor: getSelectedBlockClientId()
} = useListViewContext();
const isBlockMoveTarget = blockMovingClientId && selectedBlockInBlockEditor === clientId;
const className = dist_clsx('block-editor-list-view-block-contents', {
'is-dropping-before': isBlockMoveTarget
// Only include all selected blocks if the currently clicked on block
// is one of the selected blocks. This ensures that if a user attempts
// to drag a block that isn't part of the selection, they're still able
// to drag it and rearrange its position.
const draggableClientIds = selectedClientIds.includes(clientId) ? selectedClientIds : [clientId];
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [AdditionalBlockContent && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AdditionalBlockContent, {
insertedBlock: insertedBlock,
setInsertedBlock: setInsertedBlock
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_draggable, {
appendToOwnerDocument: true,
clientIds: draggableClientIds,
cloneClassname: "block-editor-list-view-draggable-chip",
}) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_select_button, {
onToggleExpanded: onToggleExpanded,
siblingBlockCount: siblingBlockCount,
onDragStart: onDragStart,
/* harmony default export */ const block_contents = (ListViewBlockContents);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/utils.js
const getBlockPositionDescription = (position, siblingCount, level) => (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */
(0,external_wp_i18n_namespaceObject.__)('Block %1$d of %2$d, Level %3$d.'), position, siblingCount, level);
const getBlockPropertiesDescription = isLocked => isLocked ? (0,external_wp_i18n_namespaceObject.__)('This block is locked.') : '';
* Returns true if the client ID occurs within the block selection or multi-selection,
* @param {string} clientId Block client ID.
* @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.
* @return {boolean} Whether the block is in multi-selection set.
const isClientIdSelected = (clientId, selectedBlockClientIds) => Array.isArray(selectedBlockClientIds) && selectedBlockClientIds.length ? selectedBlockClientIds.indexOf(clientId) !== -1 : selectedBlockClientIds === clientId;
* From a start and end clientId of potentially different nesting levels,
* return the nearest-depth ids that have a common level of depth in the
* nesting hierarchy. For multiple block selection, this ensure that the
* selection is always at the same nesting level, and not split across
* @param {string} startId The first id of a selection.
* @param {string} endId The end id of a selection, usually one that has been clicked on.
* @param {string[]} startParents An array of ancestor ids for the start id, in descending order.
* @param {string[]} endParents An array of ancestor ids for the end id, in descending order.
* @return {Object} An object containing the start and end ids.
function getCommonDepthClientIds(startId, endId, startParents, endParents) {
const startPath = [...startParents, startId];
const endPath = [...endParents, endId];
const depth = Math.min(startPath.length, endPath.length) - 1;
const start = startPath[depth];
const end = endPath[depth];
* Shift focus to the list view item associated with a particular clientId.
* @typedef {import('@wordpress/element').RefObject} RefObject
* @param {string} focusClientId The client ID of the block to focus.
* @param {?HTMLElement} treeGridElement The container element to search within.
function focusListItem(focusClientId, treeGridElement) {
const getFocusElement = () => {
const row = treeGridElement?.querySelector(`[role=row][data-block="${focusClientId}"]`);
// Focus the first focusable in the row, which is the ListViewBlockSelectButton.
return external_wp_dom_namespaceObject.focus.focusable.find(row)[0];
let focusElement = getFocusElement();
// The element hasn't been painted yet. Defer focusing on the next frame.
// This could happen when all blocks have been deleted and the default block
// hasn't been added to the editor yet.
window.requestAnimationFrame(() => {
focusElement = getFocusElement();
// Ignore if the element still doesn't exist.
* Get values for the block that flag whether the block should be displaced up or down,
* whether the block is being nested, and whether the block appears after the dragged
* blocks. These values are used to determine the class names to apply to the block.
* The list view rows are displaced visually via CSS rules. Displacement rules:
* - `normal`: no displacement — used to apply a translateY of `0` so that the block
* appears in its original position, and moves to that position smoothly when dragging
* outside of the list view area.
* - `up`: the block should be displaced up, creating room beneath the block for the drop indicator.
* - `down`: the block should be displaced down, creating room above the block for the drop indicator.
* @param {Object} props.blockIndexes The indexes of all the blocks in the list view, keyed by clientId.
* @param {number|null|undefined} props.blockDropTargetIndex The index of the block that the user is dropping to.
* @param {?string} props.blockDropPosition The position relative to the block that the user is dropping to.
* @param {string} props.clientId The client id for the current block.
* @param {?number} props.firstDraggedBlockIndex The index of the first dragged block.
* @param {?boolean} props.isDragged Whether the current block is being dragged. Dragged blocks skip displacement.
* @return {Object} An object containing the `displacement`, `isAfterDraggedBlocks` and `isNesting` values.
function getDragDisplacementValues({
let isAfterDraggedBlocks;
const thisBlockIndex = blockIndexes[clientId];
isAfterDraggedBlocks = thisBlockIndex > firstDraggedBlockIndex;
// Determine where to displace the position of the current block, relative
// to the blocks being dragged (in their original position) and the drop target
// (the position where a user is currently dragging the blocks to).
if (blockDropTargetIndex !== undefined && blockDropTargetIndex !== null && firstDraggedBlockIndex !== undefined) {
// If the block is being dragged and there is a valid drop target,
// determine if the block being rendered should be displaced up or down.
if (thisBlockIndex !== undefined) {
if (thisBlockIndex >= firstDraggedBlockIndex && thisBlockIndex < blockDropTargetIndex) {
// If the current block appears after the set of dragged blocks
// (in their original position), but is before the drop target,
// then the current block should be displaced up.
} else if (thisBlockIndex < firstDraggedBlockIndex && thisBlockIndex >= blockDropTargetIndex) {
// If the current block appears before the set of dragged blocks
// (in their original position), but is after the drop target,
// then the current block should be displaced down.
isNesting = typeof blockDropTargetIndex === 'number' && blockDropTargetIndex - 1 === thisBlockIndex && blockDropPosition === 'inside';
} else if (blockDropTargetIndex === null && firstDraggedBlockIndex !== undefined) {
// A `null` value for `blockDropTargetIndex` indicates that the
// drop target is outside of the valid areas within the list view.
// In this case, the drag is still active, but as there is no
// valid drop target, we should remove the gap indicating where
// the block would be inserted.
if (thisBlockIndex !== undefined && thisBlockIndex >= firstDraggedBlockIndex) {
} else if (blockDropTargetIndex !== undefined && blockDropTargetIndex !== null && firstDraggedBlockIndex === undefined) {
// If the blockdrop target is defined, but there are no dragged blocks,
// then the block should be displaced relative to the drop target.
if (thisBlockIndex !== undefined) {
if (thisBlockIndex < blockDropTargetIndex) {
} else if (blockDropTargetIndex === null) {
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/list-view/block.js
const cellRef = (0,external_wp_element_namespaceObject.useRef)(null);
const rowRef = (0,external_wp_element_namespaceObject.useRef)(null);
const settingsRef = (0,external_wp_element_namespaceObject.useRef)(null);
const [isHovered, setIsHovered] = (0,external_wp_element_namespaceObject.useState)(false);
const [settingsAnchorRect, setSettingsAnchorRect] = (0,external_wp_element_namespaceObject.useState)();
} = useBlockLock(clientId);
const isFirstSelectedBlock = isSelected && selectedClientIds[0] === clientId;
const isLastSelectedBlock = isSelected && selectedClientIds[selectedClientIds.length - 1] === clientId;
setOpenedBlockSettingsMenu
} = unlock((0,external_wp_data_namespaceObject.useDispatch)(store));
getSelectedBlockClientIds,
getPreviousBlockClientId,
} = (0,external_wp_data_namespaceObject.useSelect)(store);
} = (0,external_wp_data_namespaceObject.useSelect)(external_wp_blocks_namespaceObject.store);
const blockInformation = useBlockDisplayInformation(clientId);
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
block: getBlock(clientId),
blockName: getBlockName(clientId),
allowRightClickOverrides: getSettings().allowRightClickOverrides
// When a block hides its toolbar it also hides the block settings menu,
// since that menu is part of the toolbar in the editor canvas.
// List View respects this by also hiding the block settings menu.
(0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockName, '__experimentalToolbar', true);
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ListViewBlock);
const descriptionId = `list-view-block-select-button__description-${instanceId}`;
} = useListViewContext();
const isMatch = (0,external_wp_keyboardShortcuts_namespaceObject.__unstableUseShortcutEventMatch)();
// Determine which blocks to update:
// If the current (focused) block is part of the block selection, use the whole selection.
// If the focused block is not part of the block selection, only update the focused block.
function getBlocksToUpdate() {
const selectedBlockClientIds = getSelectedBlockClientIds();
const isUpdatingSelectedBlocks = selectedBlockClientIds.includes(clientId);
const firstBlockClientId = isUpdatingSelectedBlocks ? selectedBlockClientIds[0] : clientId;
const firstBlockRootClientId = getBlockRootClientId(firstBlockClientId);
const blocksToUpdate = isUpdatingSelectedBlocks ? selectedBlockClientIds : [clientId];
* @param {KeyboardEvent} event
async function onKeyDown(event) {
if (event.defaultPrevented) {
// Do not handle events if it comes from modals;
// retain the default behavior for these keys.
if (event.target.closest('[role=dialog]')) {
const isDeleteKey = [external_wp_keycodes_namespaceObject.BACKSPACE, external_wp_keycodes_namespaceObject.DELETE].includes(event.keyCode);
// If multiple blocks are selected, deselect all blocks when the user
// presses the escape key.
if (isMatch('core/block-editor/unselect', event) && selectedClientIds.length > 0) {
selectBlock(event, undefined);
} else if (isDeleteKey || isMatch('core/block-editor/remove', event)) {
var _getPreviousBlockClie;
blocksToUpdate: blocksToDelete,
// Don't update the selection if the blocks cannot be deleted.
if (!canRemoveBlocks(blocksToDelete)) {
let blockToFocus = (_getPreviousBlockClie = getPreviousBlockClientId(firstBlockClientId)) !== null && _getPreviousBlockClie !== void 0 ? _getPreviousBlockClie :
// If the previous block is not found (when the first block is deleted),
// fallback to focus the parent block.
removeBlocks(blocksToDelete, false);
It is recommended that you Edit text format, this type of Fix handles quite a lot in one request
