: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"
/* harmony default export */ const close_small = (closeSmall);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/tabs.js
} = unlock(external_wp_components_namespaceObject.privateApis);
/* translators: Blocks tab title in the block inserter. */
title: (0,external_wp_i18n_namespaceObject.__)('Blocks')
/* translators: Theme and Directory Patterns tab title in the block inserter. */
title: (0,external_wp_i18n_namespaceObject.__)('Patterns')
/* translators: Media tab title in the block inserter. */
title: (0,external_wp_i18n_namespaceObject.__)('Media')
const tabs = [blocksTab, patternsTab, mediaTab];
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-inserter__tabs",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(tabs_Tabs, {
selectedTabId: selectedTab,
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
className: "block-editor-inserter__tablist-and-close-button",
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, {
className: "block-editor-inserter__close-button",
label: (0,external_wp_i18n_namespaceObject.__)('Close block inserter'),
onClick: () => onClose(),
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabs_Tabs.TabList, {
className: "block-editor-inserter__tablist",
children: tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabs_Tabs.Tab, {
className: "block-editor-inserter__tab",
}), tabs.map(tab => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tabs_Tabs.TabPanel, {
className: "block-editor-inserter__tabpanel",
/* harmony default export */ const tabs = ((0,external_wp_element_namespaceObject.forwardRef)(InserterTabs));
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/menu.js
__experimentalInsertionIndex,
__experimentalFilterValue = '',
onPatternCategorySelection,
__experimentalInitialTab,
__experimentalInitialCategory
const isZoomOutMode = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).__unstableGetEditorMode() === 'zoom-out', []);
const [filterValue, setFilterValue, delayedFilterValue] = (0,external_wp_compose_namespaceObject.useDebouncedInput)(__experimentalFilterValue);
const [hoveredItem, setHoveredItem] = (0,external_wp_element_namespaceObject.useState)(null);
const [selectedPatternCategory, setSelectedPatternCategory] = (0,external_wp_element_namespaceObject.useState)(__experimentalInitialCategory);
const [patternFilter, setPatternFilter] = (0,external_wp_element_namespaceObject.useState)('all');
const [selectedMediaCategory, setSelectedMediaCategory] = (0,external_wp_element_namespaceObject.useState)(null);
const [selectedTab, setSelectedTab] = (0,external_wp_element_namespaceObject.useState)(__experimentalInitialTab);
const [destinationRootClientId, onInsertBlocks, onToggleInsertionPoint] = use_insertion_point({
insertionIndex: __experimentalInsertionIndex,
const blockTypesTabRef = (0,external_wp_element_namespaceObject.useRef)();
const onInsert = (0,external_wp_element_namespaceObject.useCallback)((blocks, meta, shouldForceFocusBlock, _rootClientId) => {
onInsertBlocks(blocks, meta, shouldForceFocusBlock, _rootClientId);
// Check for focus loss due to filtering blocks by selected block type
window.requestAnimationFrame(() => {
if (!shouldFocusBlock && !blockTypesTabRef?.current.contains(ref.current.ownerDocument.activeElement)) {
// There has been a focus loss, so focus the first button in the block types tab
blockTypesTabRef?.current.querySelector('button').focus();
}, [onInsertBlocks, onSelect, shouldFocusBlock]);
const onInsertPattern = (0,external_wp_element_namespaceObject.useCallback)((blocks, patternName) => {
}, [onInsertBlocks, onSelect]);
const onHover = (0,external_wp_element_namespaceObject.useCallback)(item => {
onToggleInsertionPoint(item);
}, [onToggleInsertionPoint, setHoveredItem]);
const onHoverPattern = (0,external_wp_element_namespaceObject.useCallback)(item => {
onToggleInsertionPoint(!!item);
}, [onToggleInsertionPoint]);
const onClickPatternCategory = (0,external_wp_element_namespaceObject.useCallback)((patternCategory, filter) => {
setSelectedPatternCategory(patternCategory);
setPatternFilter(filter);
onPatternCategorySelection?.();
}, [setSelectedPatternCategory, onPatternCategorySelection]);
const showPatternPanel = selectedTab === 'patterns' && !delayedFilterValue && !!selectedPatternCategory;
const showMediaPanel = selectedTab === 'media' && !!selectedMediaCategory;
const inserterSearch = (0,external_wp_element_namespaceObject.useMemo)(() => {
if (selectedTab === 'media') {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, {
__nextHasNoMarginBottom: true,
className: "block-editor-inserter__search",
label: (0,external_wp_i18n_namespaceObject.__)('Search for blocks and patterns'),
placeholder: (0,external_wp_i18n_namespaceObject.__)('Search')
}), !!delayedFilterValue && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_results, {
filterValue: delayedFilterValue,
onHoverPattern: onHoverPattern,
rootClientId: rootClientId,
__experimentalInsertionIndex: __experimentalInsertionIndex,
showBlockDirectory: true,
shouldFocusBlock: shouldFocusBlock,
prioritizePatterns: selectedTab === 'patterns'
}, [selectedTab, hoveredItem, setHoveredItem, setFilterValue, filterValue, delayedFilterValue, onSelect, onHover, onHoverPattern, shouldFocusBlock, clientId, rootClientId, __experimentalInsertionIndex, isAppender]);
const blocksTab = (0,external_wp_element_namespaceObject.useMemo)(() => {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-inserter__block-list",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_types_tab, {
rootClientId: destinationRootClientId,
showMostUsedBlocks: showMostUsedBlocks
}), showInserterHelpPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
className: "block-editor-inserter__tips",
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, {
children: (0,external_wp_i18n_namespaceObject.__)('A tip for using the block editor')
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tips, {})]
}, [destinationRootClientId, onInsert, onHover, showMostUsedBlocks, showInserterHelpPanel]);
const patternsTab = (0,external_wp_element_namespaceObject.useMemo)(() => {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_patterns_tab, {
rootClientId: destinationRootClientId,
onInsert: onInsertPattern,
onSelectCategory: onClickPatternCategory,
selectedCategory: selectedPatternCategory,
children: showPatternPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PatternCategoryPreviewPanel, {
rootClientId: destinationRootClientId,
onInsert: onInsertPattern,
category: selectedPatternCategory,
patternFilter: patternFilter,
showTitlesAsTooltip: true
}, [destinationRootClientId, onHoverPattern, onInsertPattern, onClickPatternCategory, patternFilter, selectedPatternCategory, showPatternPanel]);
const mediaTab = (0,external_wp_element_namespaceObject.useMemo)(() => {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_tab, {
rootClientId: destinationRootClientId,
selectedCategory: selectedMediaCategory,
onSelectCategory: setSelectedMediaCategory,
children: showMediaPanel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaCategoryPanel, {
rootClientId: destinationRootClientId,
category: selectedMediaCategory
}, [destinationRootClientId, onInsert, selectedMediaCategory, setSelectedMediaCategory, showMediaPanel]);
const handleSetSelectedTab = value => {
// If no longer on patterns tab remove the category setting.
if (value !== 'patterns') {
setSelectedPatternCategory(null);
// Focus first active tab, if any
const tabsRef = (0,external_wp_element_namespaceObject.useRef)();
(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
window.requestAnimationFrame(() => {
tabsRef.current.querySelector('[role="tab"][aria-selected="true"]')?.focus();
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
className: dist_clsx('block-editor-inserter__menu', {
'show-panel': showPatternPanel || showMediaPanel,
'is-zoom-out': isZoomOutMode
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-inserter__main-area",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(tabs, {
onSelect: handleSetSelectedTab,
selectedTab: selectedTab,
children: [inserterSearch, selectedTab === 'blocks' && !delayedFilterValue && blocksTab, selectedTab === 'patterns' && !delayedFilterValue && patternsTab, selectedTab === 'media' && mediaTab]
}), showInserterHelpPanel && hoveredItem && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, {
className: "block-editor-inserter__preview-container__popover",
placement: "right-start",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(preview_panel, {
const PrivateInserterMenu = (0,external_wp_element_namespaceObject.forwardRef)(InserterMenu);
function PublicInserterMenu(props, ref) {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateInserterMenu, {
onPatternCategorySelection: NOOP,
/* harmony default export */ const menu = ((0,external_wp_element_namespaceObject.forwardRef)(PublicInserterMenu));
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/quick-inserter.js
const SEARCH_THRESHOLD = 6;
const quick_inserter_SHOWN_BLOCK_TYPES = 6;
const SHOWN_BLOCK_PATTERNS = 2;
const SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION = 4;
const [filterValue, setFilterValue] = (0,external_wp_element_namespaceObject.useState)('');
const [destinationRootClientId, onInsertBlocks] = use_insertion_point({
const [blockTypes] = use_block_types_state(destinationRootClientId, onInsertBlocks, true);
const [patterns] = use_patterns_state(onInsertBlocks, destinationRootClientId);
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
const settings = getSettings();
const index = getBlockIndex(clientId);
const blockCount = getBlockCount();
setInserterIsOpened: settings.__experimentalSetIsInserterOpened,
insertionIndex: index === -1 ? blockCount : index
const showPatterns = patterns.length && (!!filterValue || prioritizePatterns);
const showSearch = hasSearch && (showPatterns && patterns.length > SEARCH_THRESHOLD || blockTypes.length > SEARCH_THRESHOLD);
(0,external_wp_element_namespaceObject.useEffect)(() => {
if (setInserterIsOpened) {
setInserterIsOpened(false);
}, [setInserterIsOpened]);
// When clicking Browse All select the appropriate block so as
// the insertion point can work as expected.
const onBrowseAll = () => {
let maxBlockPatterns = 0;
maxBlockPatterns = prioritizePatterns ? SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION : SHOWN_BLOCK_PATTERNS;
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
className: dist_clsx('block-editor-inserter__quick-inserter', {
'has-search': showSearch,
'has-expand': setInserterIsOpened
children: [showSearch && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.SearchControl, {
__nextHasNoMarginBottom: true,
className: "block-editor-inserter__search",
label: (0,external_wp_i18n_namespaceObject.__)('Search for blocks and patterns'),
placeholder: (0,external_wp_i18n_namespaceObject.__)('Search')
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-inserter__quick-inserter-results",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_results, {
filterValue: filterValue,
rootClientId: rootClientId,
maxBlockPatterns: maxBlockPatterns,
maxBlockTypes: quick_inserter_SHOWN_BLOCK_TYPES,
prioritizePatterns: prioritizePatterns,
selectBlockOnInsert: selectBlockOnInsert,
}), setInserterIsOpened && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, {
className: "block-editor-inserter__quick-inserter-expand",
"aria-label": (0,external_wp_i18n_namespaceObject.__)('Browse all. This will open the main inserter panel in the editor toolbar.'),
children: (0,external_wp_i18n_namespaceObject.__)('Browse all')
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/index.js
const defaultRenderToggle = ({
as: Wrapper = external_wp_components_namespaceObject.Button,
if (!label && hasSingleBlockType) {
label = (0,external_wp_i18n_namespaceObject.sprintf)(
// translators: %s: the name of the block when there is only one
(0,external_wp_i18n_namespaceObject._x)('Add %s', 'directly add the only allowed block'), blockTitle);
} else if (!label && prioritizePatterns) {
label = (0,external_wp_i18n_namespaceObject.__)('Add pattern');
label = (0,external_wp_i18n_namespaceObject._x)('Add block', 'Generic label for block inserter button');
// Handle both onClick functions from the toggle and the parent component.
function handleClick(event) {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Wrapper, {
tooltipPosition: "bottom",
className: "block-editor-inserter__toggle",
"aria-haspopup": !hasSingleBlockType ? 'true' : false,