: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
const getIsHovered = () => {
return ref?.current && ref.current.matches(':hover');
const shouldHideGestures = () => {
const isHovered = getIsHovered();
return !isFocused && !isHovered;
const clearTimeoutRef = () => {
const timeout = timeoutRef.current;
if (timeout && utils_clearTimeout) {
utils_clearTimeout(timeout);
const debouncedShowGestures = event => {
const debouncedHideGestures = event => {
timeoutRef.current = utils_setTimeout(() => {
if (shouldHideGestures()) {
(0,external_wp_element_namespaceObject.useEffect)(() => () => {
* We need to call the change handler with `isFocused`
* set to false on unmount because we also clear the
* timeout that would handle that.
* Hook that provides gesture events for DOM elements
* that interact with the isFocused state.
* @param {Object} props Component props.
* @param {Object} props.ref Element reference.
* @param {number} [props.highlightParent=false] Whether to highlight the parent block. It defaults to highlighting the selected block.
* @param {number} [props.debounceTimeout=250] Debounce timeout in milliseconds.
function useShowHoveredOrFocusedGestures({
debounceTimeout = DEBOUNCE_TIMEOUT
const [isFocused, setIsFocused] = (0,external_wp_element_namespaceObject.useState)(false);
} = useDebouncedShowGestures({
const registerRef = (0,external_wp_element_namespaceObject.useRef)(false);
const isFocusedWithin = () => {
return ref?.current && ref.current.contains(ref.current.ownerDocument.activeElement);
(0,external_wp_element_namespaceObject.useEffect)(() => {
const node = ref.current;
const handleOnFocus = () => {
const handleOnBlur = () => {
if (!isFocusedWithin()) {
* Events are added via DOM events (vs. React synthetic events),
* as the child React components swallow mouse events.
if (node && !registerRef.current) {
node.addEventListener('focus', handleOnFocus, true);
node.addEventListener('blur', handleOnBlur, true);
registerRef.current = true;
node.removeEventListener('focus', handleOnFocus);
node.removeEventListener('blur', handleOnBlur);
}, [ref, registerRef, setIsFocused, debouncedShowGestures, debouncedHideGestures]);
onMouseMove: debouncedShowGestures,
onMouseLeave: debouncedHideGestures
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-parent-selector/index.js
* Block parent selector component, displaying the hierarchy of the
* current block selection as a single icon to "go up" a level.
* @return {Component} Parent block selector.
function BlockParentSelector() {
} = (0,external_wp_data_namespaceObject.useDispatch)(store);
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
getSelectedBlockClientId,
} = select(external_wp_blocks_namespaceObject.store);
const selectedBlockClientId = getSelectedBlockClientId();
const parents = getBlockParents(selectedBlockClientId);
const _firstParentClientId = parents[parents.length - 1];
const parentBlockName = getBlockName(_firstParentClientId);
const _parentBlockType = (0,external_wp_blocks_namespaceObject.getBlockType)(parentBlockName);
firstParentClientId: _firstParentClientId,
isVisible: _firstParentClientId && getBlockEditingMode(_firstParentClientId) === 'default' && hasBlockSupport(_parentBlockType, '__experimentalParentSelector', true)
const blockInformation = useBlockDisplayInformation(firstParentClientId);
// Allows highlighting the parent block outline when focusing or hovering
// the parent block selector within the child.
const nodeRef = (0,external_wp_element_namespaceObject.useRef)();
const showHoveredOrFocusedGestures = useShowHoveredOrFocusedGestures({
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-parent-selector",
...showHoveredOrFocusedGestures,
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToolbarButton, {
className: "block-editor-block-parent-selector__button",
onClick: () => selectBlock(firstParentClientId),
label: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: Name of the block's parent. */
(0,external_wp_i18n_namespaceObject.__)('Select parent block: %s'), blockInformation?.title),
icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, {
icon: blockInformation?.icon
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/copy.js
const copy_copy = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z"
/* harmony default export */ const library_copy = (copy_copy);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/preview-block-popover.js
function PreviewBlockPopover({
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-switcher__popover__preview__parent",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-switcher__popover__preview__container",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, {
className: "block-editor-block-switcher__preview__popover",
placement: "bottom-start",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
className: "block-editor-block-switcher__preview",
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-switcher__preview-title",
children: (0,external_wp_i18n_namespaceObject.__)('Preview')
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, {
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/block-variation-transformations.js
const block_variation_transformations_EMPTY_OBJECT = {};
function useBlockVariationTransforms({
blockVariationTransformations
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
} = select(external_wp_blocks_namespaceObject.store);
const canRemove = canRemoveBlocks(clientIds);
// Only handle single selected blocks for now.
if (blocks.length !== 1 || !canRemove) {
return block_variation_transformations_EMPTY_OBJECT;
const [firstBlock] = blocks;
blockVariationTransformations: getBlockVariations(firstBlock.name, 'transform'),
activeBlockVariation: getActiveBlockVariation(firstBlock.name, getBlockAttributes(firstBlock.clientId))
const transformations = (0,external_wp_element_namespaceObject.useMemo)(() => {
return blockVariationTransformations?.filter(({
}) => name !== activeBlockVariation?.name);
}, [blockVariationTransformations, activeBlockVariation]);
const BlockVariationTransformations = ({
const [hoveredTransformItemName, setHoveredTransformItemName] = (0,external_wp_element_namespaceObject.useState)();
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [hoveredTransformItemName && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewBlockPopover, {
blocks: (0,external_wp_blocks_namespaceObject.cloneBlock)(blocks[0], transformations.find(({
}) => name === hoveredTransformItemName).attributes)
}), transformations?.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockVariationTranformationItem, {
setHoveredTransformItemName: setHoveredTransformItemName
function BlockVariationTranformationItem({
setHoveredTransformItemName
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuItem, {
className: (0,external_wp_blocks_namespaceObject.getBlockMenuDefaultClassName)(name),
onMouseLeave: () => setHoveredTransformItemName(null),
onMouseEnter: () => setHoveredTransformItemName(name),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, {
/* harmony default export */ const block_variation_transformations = (BlockVariationTransformations);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-switcher/block-transformations-menu.js
* Helper hook to group transformations to display them in a specific order in the UI.
* For now we group only priority content driven transformations(ex. paragraph -> heading).
* Later on we could also group 'layout' transformations(ex. paragraph -> group) and
* display them in different sections.
* @param {Object[]} possibleBlockTransformations The available block transformations.
* @return {Record<string, Object[]>} The grouped block transformations.
function useGroupedTransforms(possibleBlockTransformations) {
const priorityContentTranformationBlocks = {
const transformations = (0,external_wp_element_namespaceObject.useMemo)(() => {
const priorityTextTranformsNames = Object.keys(priorityContentTranformationBlocks);
const groupedPossibleTransforms = possibleBlockTransformations.reduce((accumulator, item) => {
if (priorityTextTranformsNames.includes(name)) {
accumulator.priorityTextTransformations.push(item);
accumulator.restTransformations.push(item);
priorityTextTransformations: [],
* If there is only one priority text transformation and it's a Quote,
* is should move to the rest transformations. This is because Quote can
* be a container for any block type, so in multi-block selection it will
* always be suggested, even for non-text blocks.
if (groupedPossibleTransforms.priorityTextTransformations.length === 1 && groupedPossibleTransforms.priorityTextTransformations[0].name === 'core/quote') {
const singleQuote = groupedPossibleTransforms.priorityTextTransformations.pop();
groupedPossibleTransforms.restTransformations.push(singleQuote);
return groupedPossibleTransforms;
}, [possibleBlockTransformations]);
// Order the priority text transformations.
transformations.priorityTextTransformations.sort(({
return priorityContentTranformationBlocks[currentName] < priorityContentTranformationBlocks[nextName] ? -1 : 1;
const BlockTransformationsMenu = ({
possibleBlockTransformations,
possibleBlockVariationTransformations,
const [hoveredTransformItemName, setHoveredTransformItemName] = (0,external_wp_element_namespaceObject.useState)();
priorityTextTransformations,
} = useGroupedTransforms(possibleBlockTransformations);
// We have to check if both content transformations(priority and rest) are set
// in order to create a separate MenuGroup for them.
const hasBothContentTransformations = priorityTextTransformations.length && restTransformations.length;
const restTransformItems = !!restTransformations.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RestTransformationItems, {
restTransformations: restTransformations,
setHoveredTransformItemName: setHoveredTransformItemName
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuGroup, {
label: (0,external_wp_i18n_namespaceObject.__)('Transform to'),
children: [hoveredTransformItemName && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PreviewBlockPopover, {
blocks: (0,external_wp_blocks_namespaceObject.switchToBlockType)(blocks, hoveredTransformItemName)
}), !!possibleBlockVariationTransformations?.length && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_variation_transformations, {
transformations: possibleBlockVariationTransformations,
onSelect: onSelectVariation
}), priorityTextTransformations.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTranformationItem, {
setHoveredTransformItemName: setHoveredTransformItemName
}, item.name)), !hasBothContentTransformations && restTransformItems]
}), !!hasBothContentTransformations && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.MenuGroup, {
children: restTransformItems
function RestTransformationItems({
setHoveredTransformItemName
return restTransformations.map(item => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockTranformationItem, {
setHoveredTransformItemName: setHoveredTransformItemName
function BlockTranformationItem({
setHoveredTransformItemName
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.MenuItem, {
className: (0,external_wp_blocks_namespaceObject.getBlockMenuDefaultClassName)(name),
onMouseLeave: () => setHoveredTransformItemName(null),
onMouseEnter: () => setHoveredTransformItemName(name),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_icon, {
/* harmony default export */ const block_transformations_menu = (BlockTransformationsMenu);