: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
const blockEditContext = useBlockEditContext();
const hasBlockBindings = !!blockEditContext[blockBindingsKey];
const bindingsStyle = hasBlockBindings && canBindBlock(name) ? {
'--wp-admin-theme-color': 'var(--wp-block-synced-color)',
'--wp-admin-theme-color--rgb': 'var(--wp-block-synced-color--rgb)'
// Ensures it warns only inside the `edit` implementation for the block.
if (blockApiVersion < 2 && clientId === blockEditContext.clientId) {
true ? external_wp_warning_default()(`Block type "${name}" must support API version 2 or higher to work correctly with "useBlockProps" method.`) : 0;
let hasNegativeMargin = false;
if (wrapperProps?.style?.marginTop?.charAt(0) === '-' || wrapperProps?.style?.marginBottom?.charAt(0) === '-' || wrapperProps?.style?.marginLeft?.charAt(0) === '-' || wrapperProps?.style?.marginRight?.charAt(0) === '-') {
hasNegativeMargin = true;
tabIndex: blockEditingMode === 'disabled' ? -1 : 0,
id: `block-${clientId}${htmlSuffix}`,
'aria-label': blockLabel,
'data-title': blockTitle,
inert: isSubtreeDisabled ? 'true' : undefined,
className: dist_clsx('block-editor-block-list__block', {
// The wp-block className is important for editor styles.
'has-block-overlay': hasOverlay,
'is-selected': isSelected,
'is-highlighted': isHighlighted,
'is-multi-selected': isMultiSelected,
'is-partially-selected': isPartiallySelected,
'is-reusable': isReusable,
'is-dragging': isDragging,
'has-child-selected': hasChildSelected,
'is-block-moving-mode': isBlockMovingMode,
'can-insert-moving-block': canInsertMovingBlock,
'is-editing-disabled': isEditingDisabled,
'has-editable-outline': hasEditableOutline,
'has-negative-margin': hasNegativeMargin,
'is-content-locked-temporarily-editing-as-blocks': isTemporarilyEditingAsBlocks
}, className, props.className, wrapperProps.className, defaultClassName),
* Call within a save function to get the props for the block wrapper.
* @param {Object} props Optional. Props to pass to the element.
use_block_props_useBlockProps.save = external_wp_blocks_namespaceObject.__unstableGetBlockProps;
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-list/block.js
* Merges wrapper props with special handling for classNames and styles.
* @return {Object} Merged props.
function mergeWrapperProps(propsA, propsB) {
// May be set to undefined, so check if the property is set!
if (propsA?.hasOwnProperty('className') && propsB?.hasOwnProperty('className')) {
newProps.className = dist_clsx(propsA.className, propsB.className);
if (propsA?.hasOwnProperty('style') && propsB?.hasOwnProperty('style')) {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
...use_block_props_useBlockProps(props, {
function BlockListBlock({
__unstableLayoutClassNames: layoutClassNames,
mayDisplayParentControls,
} = (0,external_wp_element_namespaceObject.useContext)(PrivateBlockContext);
} = (0,external_wp_data_namespaceObject.useDispatch)(store);
const onRemove = (0,external_wp_element_namespaceObject.useCallback)(() => removeBlock(clientId), [clientId, removeBlock]);
const parentLayout = useLayout() || {};
// We wrap the BlockEdit component in a div that hides it when editing in
// HTML mode. This allows us to render all of the ancillary pieces
// (InspectorControls, etc.) which are inside `BlockEdit` but not
// `BlockHTML`, even in HTML mode.
let blockEdit = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockEdit, {
setAttributes: setAttributes,
insertBlocksAfter: isLocked ? undefined : onInsertBlocksAfter,
onReplace: canRemove ? onReplace : undefined,
onRemove: canRemove ? onRemove : undefined,
mergeBlocks: canRemove ? onMerge : undefined,
isSelectionEnabled: isSelectionEnabled,
toggleSelection: toggleSelection,
__unstableLayoutClassNames: layoutClassNames,
__unstableParentLayout: Object.keys(parentLayout).length ? parentLayout : undefined,
mayDisplayControls: mayDisplayControls,
mayDisplayParentControls: mayDisplayParentControls,
blockEditingMode: context.blockEditingMode,
isPreviewMode: context.isPreviewMode
const blockType = (0,external_wp_blocks_namespaceObject.getBlockType)(name);
// Determine whether the block has props to apply to the wrapper.
if (blockType?.getEditWrapperProps) {
wrapperProps = mergeWrapperProps(wrapperProps, blockType.getEditWrapperProps(attributes));
const isAligned = wrapperProps && !!wrapperProps['data-align'] && !themeSupportsLayout;
// Support for sticky position in classic themes with alignment wrappers.
const isSticky = className?.includes('is-position-sticky');
// For aligned blocks, provide a wrapper element so the block can be
// positioned relative to the block column.
// This is only kept for classic themes that don't support layout
// Historically we used to rely on extra divs and data-align to
// provide the alignments styles in the editor.
// Due to the differences between frontend and backend, we migrated
// to the layout feature, and we're now aligning the markup of frontend
blockEdit = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: dist_clsx('wp-block', isSticky && className),
"data-align": wrapperProps['data-align'],
const saveContent = __unstableBlockSource ? (0,external_wp_blocks_namespaceObject.serializeRawBlock)(__unstableBlockSource) : (0,external_wp_blocks_namespaceObject.getSaveContent)(blockType, attributes);
block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Block, {
className: "has-warning",
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockInvalidWarning, {
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.RawHTML, {
children: (0,external_wp_dom_namespaceObject.safeHTML)(saveContent)
} else if (mode === 'html') {
// Render blockEdit so the inspector controls don't disappear.
block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, {
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_html, {
} else if (blockType?.apiVersion > 1) {
block = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, {
} = (_wrapperProps = wrapperProps) !== null && _wrapperProps !== void 0 ? _wrapperProps : {};
const updatedWrapperProps = {
className: dist_clsx(restWrapperProps.className, dataAlign && themeSupportsLayout && `align${dataAlign}`, !(dataAlign && isSticky) && className)
// We set a new context with the adjusted and filtered wrapperProps (through
// `editor.BlockListBlock`), which the `BlockListBlockProvider` did not have
// Note that the context value doesn't have to be memoized in this case
// because when it changes, this component will be re-rendered anyway, and
// none of the consumers (BlockListBlock and useBlockProps) are memoized or
// "pure". This is different from the public BlockEditContext, where
// consumers might be memoized or "pure".
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockContext.Provider, {
wrapperProps: updatedWrapperProps,
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_crash_boundary, {
fallback: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Block, {
className: "has-warning",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_crash_warning, {})
const applyWithDispatch = (0,external_wp_data_namespaceObject.withDispatch)((dispatch, ownProps, registry) => {
__unstableMarkLastChangeAsPersistent,
// Do not add new properties here, use `useDispatch` instead to avoid
// leaking new props to the public API (editor.BlockListBlock filter).
setAttributes(newAttributes) {
getMultiSelectedBlockClientIds
} = registry.select(store);
const multiSelectedBlockClientIds = getMultiSelectedBlockClientIds();
const clientIds = multiSelectedBlockClientIds.length ? multiSelectedBlockClientIds : [clientId];
updateBlockAttributes(clientIds, newAttributes);
onInsertBlocks(blocks, index) {
insertBlocks(blocks, index, rootClientId);
onInsertBlocksAfter(blocks) {
} = registry.select(store);
const index = getBlockIndex(clientId);
insertBlocks(blocks, index + 1, rootClientId);
getPreviousBlockClientId,
} = registry.select(store);
function switchToDefaultOrRemove() {
const block = getBlock(clientId);
const defaultBlockName = (0,external_wp_blocks_namespaceObject.getDefaultBlockName)();
if (getBlockName(clientId) !== defaultBlockName) {
const replacement = (0,external_wp_blocks_namespaceObject.switchToBlockType)(block, defaultBlockName);
if (replacement && replacement.length) {
replaceBlocks(clientId, replacement);
} else if ((0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(block)) {
const nextBlockClientId = getNextBlockClientId(clientId);
selectBlock(nextBlockClientId);
* Moves the block with clientId up one level. If the block type
* cannot be inserted at the new location, it will be attempted to
* convert to the default block type.
* @param {string} _clientId The block to move.
* @param {boolean} changeSelection Whether to change the selection
function moveFirstItemUp(_clientId, changeSelection = true) {
const targetRootClientId = getBlockRootClientId(_clientId);
const blockOrder = getBlockOrder(_clientId);
const [firstClientId] = blockOrder;
if (blockOrder.length === 1 && (0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(getBlock(firstClientId))) {
if (canInsertBlockType(getBlockName(firstClientId), targetRootClientId)) {
moveBlocksToPosition([firstClientId], _clientId, targetRootClientId, getBlockIndex(_clientId));
const replacement = (0,external_wp_blocks_namespaceObject.switchToBlockType)(getBlock(firstClientId), (0,external_wp_blocks_namespaceObject.getDefaultBlockName)());
if (replacement && replacement.length && replacement.every(block => canInsertBlockType(block.name, targetRootClientId))) {
insertBlocks(replacement, getBlockIndex(_clientId), targetRootClientId, changeSelection);
removeBlock(firstClientId, false);
switchToDefaultOrRemove();
if (!getBlockOrder(_clientId).length && (0,external_wp_blocks_namespaceObject.isUnmodifiedBlock)(getBlock(_clientId))) {
removeBlock(_clientId, false);
// For `Delete` or forward merge, we should do the exact same thing
// as `Backspace`, but from the other block.
const nextRootClientId = getNextBlockClientId(rootClientId);
// If there is a block that follows with the same parent
// block name and the same attributes, merge the inner
if (getBlockName(rootClientId) === getBlockName(nextRootClientId)) {
const rootAttributes = getBlockAttributes(rootClientId);
const previousRootAttributes = getBlockAttributes(nextRootClientId);
if (Object.keys(rootAttributes).every(key => rootAttributes[key] === previousRootAttributes[key])) {
moveBlocksToPosition(getBlockOrder(nextRootClientId), nextRootClientId, rootClientId);
removeBlock(nextRootClientId, false);
mergeBlocks(rootClientId, nextRootClientId);
const nextBlockClientId = getNextBlockClientId(clientId);
if (!nextBlockClientId) {
if (getBlockOrder(nextBlockClientId).length) {
moveFirstItemUp(nextBlockClientId, false);
mergeBlocks(clientId, nextBlockClientId);
const previousBlockClientId = getPreviousBlockClientId(clientId);
if (previousBlockClientId) {
mergeBlocks(previousBlockClientId, clientId);
} else if (rootClientId) {
const previousRootClientId = getPreviousBlockClientId(rootClientId);
// If there is a preceding block with the same parent block
// name and the same attributes, merge the inner blocks.
if (previousRootClientId && getBlockName(rootClientId) === getBlockName(previousRootClientId)) {
const rootAttributes = getBlockAttributes(rootClientId);
const previousRootAttributes = getBlockAttributes(previousRootClientId);
if (Object.keys(rootAttributes).every(key => rootAttributes[key] === previousRootAttributes[key])) {
moveBlocksToPosition(getBlockOrder(rootClientId), rootClientId, previousRootClientId);
removeBlock(rootClientId, false);
moveFirstItemUp(rootClientId);
switchToDefaultOrRemove();
onReplace(blocks, indexToSelect, initialPosition) {
if (blocks.length && !(0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(blocks[blocks.length - 1])) {
__unstableMarkLastChangeAsPersistent();
//Unsynced patterns are nested in an array so we need to flatten them.
const replacementBlocks = blocks?.length === 1 && Array.isArray(blocks[0]) ? blocks[0] : blocks;
replaceBlocks([ownProps.clientId], replacementBlocks, indexToSelect, initialPosition);
toggleSelection(selectionEnabled) {
toggleSelection(selectionEnabled);
// This component is used by the BlockListBlockProvider component below. It will
// add the props necessary for the `editor.BlockListBlock` filters.
BlockListBlock = (0,external_wp_compose_namespaceObject.compose)(applyWithDispatch, (0,external_wp_components_namespaceObject.withFilters)('editor.BlockListBlock'))(BlockListBlock);
// This component provides all the information we need through a single store
// subscription (useSelect mapping). Only the necessary props are passed down
// to the BlockListBlock component, which is a filtered component, so these
// props are public API. To avoid adding to the public API, we use a private
// context to pass the rest of the information to the filtered BlockListBlock
// component, and useBlockProps.
function BlockListBlockProvider(props) {
const selectedProps = (0,external_wp_data_namespaceObject.useSelect)(select => {
getBlockWithoutAttributes,
getTemporarilyEditingAsBlocks,