: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-patterns-list/index.js
CompositeV2: block_patterns_list_Composite,
CompositeItemV2: block_patterns_list_CompositeItem,
useCompositeStoreV2: block_patterns_list_useCompositeStore
} = unlock(external_wp_components_namespaceObject.privateApis);
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Tooltip, {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
const [isDragging, setIsDragging] = (0,external_wp_element_namespaceObject.useState)(false);
const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(BlockPattern);
const descriptionId = `block-editor-block-patterns-list__item-description-${instanceId}`;
// When we have a selected category and the pattern is draggable, we need to update the
// pattern's categories in metadata to only contain the selected category, and pass this to
// InserterDraggableBlocks component. We do that because we use this information for pattern
// shuffling and it makes more sense to show only the ones from the initially selected category during insertion.
const patternBlocks = (0,external_wp_element_namespaceObject.useMemo)(() => {
if (!category || !isDraggable) {
return (blocks !== null && blocks !== void 0 ? blocks : []).map(block => {
const clonedBlock = (0,external_wp_blocks_namespaceObject.cloneBlock)(block);
if (clonedBlock.attributes.metadata?.categories?.includes(category)) {
clonedBlock.attributes.metadata.categories = [category];
}, [blocks, isDraggable, category]);
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inserter_draggable_blocks, {
}) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-patterns-list__list-item",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolTip, {
showTooltip: showTooltip && !pattern.type !== INSERTER_PATTERN_TYPES.user,
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(block_patterns_list_CompositeItem, {
render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
"aria-label": pattern.title,
"aria-describedby": pattern.description ? descriptionId : undefined,
className: dist_clsx('block-editor-block-patterns-list__item', {
'block-editor-block-patterns-list__list-item-synced': pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus
onClick(pattern, blocks);
onMouseLeave: () => onHover?.(null),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(block_preview, {
viewportWidth: viewportWidth
}), showTitle && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, {
className: "block-editor-patterns__pattern-details",
children: [pattern.type === INSERTER_PATTERN_TYPES.user && !pattern.syncStatus && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-patterns__pattern-icon-wrapper",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
className: "block-editor-patterns__pattern-icon",
}), (!showTooltip || pattern.type === INSERTER_PATTERN_TYPES.user) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-patterns-list__item-title",
}), !!pattern.description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.VisuallyHidden, {
children: pattern.description
function BlockPatternPlaceholder() {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-block-patterns-list__item is-placeholder"
function BlockPatternsList({
label = (0,external_wp_i18n_namespaceObject.__)('Block patterns'),
const compositeStore = block_patterns_list_useCompositeStore({
(0,external_wp_element_namespaceObject.useEffect)(() => {
// We reset the active composite item whenever the
// available patterns change, to make sure that
// focus is put back to the start.
}, [setActiveId, shownPatterns, blockPatterns]);
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(block_patterns_list_Composite, {
className: "block-editor-block-patterns-list",
children: [blockPatterns.map(pattern => {
const isShown = shownPatterns.includes(pattern);
return isShown ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPattern, {
isDraggable: isDraggable,
showTooltip: showTitlesAsTooltip,
}, pattern.name) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BlockPatternPlaceholder, {}, pattern.name);
}), pagingProps && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Pagination, {
/* harmony default export */ const block_patterns_list = ((0,external_wp_element_namespaceObject.forwardRef)(BlockPatternsList));
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-insertion-point.js
if (rootClientId === destinationRootClientId) {
const parents = ['', ...registry.select(store).getBlockParents(destinationRootClientId), destinationRootClientId];
const parentIndex = parents.indexOf(rootClientId);
if (parentIndex !== -1) {
return registry.select(store).getBlockIndex(parents[parentIndex + 1]) + 1;
return registry.select(store).getBlockOrder(rootClientId).length;
* @typedef WPInserterConfig
* @property {string=} rootClientId If set, insertion will be into the
* @property {number=} insertionIndex If set, insertion will be into this
* @property {string=} clientId If set, insertion will be after the
* @property {boolean=} isAppender Whether the inserter is an appender
* @property {Function=} onSelect Called after insertion.
* Returns the insertion point state given the inserter config.
* @param {WPInserterConfig} config Inserter Config.
* @return {Array} Insertion Point State (rootClientID, onInsertBlocks and onToggle).
function useInsertionPoint({
selectBlockOnInsert = true
const registry = (0,external_wp_data_namespaceObject.useRegistry)();
} = (0,external_wp_data_namespaceObject.useSelect)(store);
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
getSelectedBlockClientId,
const selectedBlockClientId = getSelectedBlockClientId();
let _destinationRootClientId = rootClientId;
if (insertionIndex !== undefined) {
// Insert into a specific index.
_destinationIndex = insertionIndex;
// Insert after a specific client ID.
_destinationIndex = getBlockIndex(clientId);
} else if (!isAppender && selectedBlockClientId) {
_destinationRootClientId = getBlockRootClientId(selectedBlockClientId);
_destinationIndex = getBlockIndex(selectedBlockClientId) + 1;
// Insert at the end of the list.
_destinationIndex = getBlockOrder(_destinationRootClientId).length;
destinationRootClientId: _destinationRootClientId,
destinationIndex: _destinationIndex
}, [rootClientId, insertionIndex, clientId, isAppender]);
} = unlock((0,external_wp_data_namespaceObject.useDispatch)(store));
const onInsertBlocks = (0,external_wp_element_namespaceObject.useCallback)((blocks, meta, shouldForceFocusBlock = false, _rootClientId) => {
// When we are trying to move focus or select a new block on insert, we also
// need to clear the last focus to avoid the focus being set to the wrong block
// when tabbing back into the canvas if the block was added from outside the
if (shouldForceFocusBlock || shouldFocusBlock || selectBlockOnInsert) {
const selectedBlock = getSelectedBlock();
if (!isAppender && selectedBlock && (0,external_wp_blocks_namespaceObject.isUnmodifiedDefaultBlock)(selectedBlock)) {
replaceBlocks(selectedBlock.clientId, blocks, null, shouldFocusBlock || shouldForceFocusBlock ? 0 : null, meta);
insertBlocks(blocks, isAppender || _rootClientId === undefined ? destinationIndex : getIndex({
rootClientId: _rootClientId,
}), isAppender || _rootClientId === undefined ? destinationRootClientId : _rootClientId, selectBlockOnInsert, shouldFocusBlock || shouldForceFocusBlock ? 0 : null, meta);
const blockLength = Array.isArray(blocks) ? blocks.length : 1;
const message = (0,external_wp_i18n_namespaceObject.sprintf)(
// translators: %d: the name of the block that has been added
(0,external_wp_i18n_namespaceObject._n)('%d block added.', '%d blocks added.', blockLength), blockLength);
(0,external_wp_a11y_namespaceObject.speak)(message);
}, [isAppender, getSelectedBlock, replaceBlocks, insertBlocks, destinationRootClientId, destinationIndex, onSelect, shouldFocusBlock, selectBlockOnInsert]);
const onToggleInsertionPoint = (0,external_wp_element_namespaceObject.useCallback)(item => {
if (item?.hasOwnProperty('rootClientId')) {
showInsertionPoint(item.rootClientId, getIndex({
rootClientId: item.rootClientId,
}, [showInsertionPoint, hideInsertionPoint, destinationRootClientId, destinationIndex]);
return [destinationRootClientId, onInsertBlocks, onToggleInsertionPoint];
/* harmony default export */ const use_insertion_point = (useInsertionPoint);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-patterns-state.js
* Retrieves the block patterns inserter state.
* @param {Function} onInsert function called when inserter a list of blocks.
* @param {string=} rootClientId Insertion's root client ID.
* @param {string} selectedCategory The selected pattern category.
* @return {Array} Returns the patterns state. (patterns, categories, onSelect handler)
const usePatternsState = (onInsert, rootClientId, selectedCategory) => {
} = (0,external_wp_data_namespaceObject.useSelect)(select => {
__experimentalGetAllowedPatterns,
__experimentalUserPatternCategories,
__experimentalBlockPatternCategories
patterns: __experimentalGetAllowedPatterns(rootClientId),
userPatternCategories: __experimentalUserPatternCategories,
patternCategories: __experimentalBlockPatternCategories
const allCategories = (0,external_wp_element_namespaceObject.useMemo)(() => {
const categories = [...patternCategories];
userPatternCategories?.forEach(userCategory => {
if (!categories.find(existingCategory => existingCategory.name === userCategory.name)) {
categories.push(userCategory);
}, [patternCategories, userPatternCategories]);
} = (0,external_wp_data_namespaceObject.useDispatch)(external_wp_notices_namespaceObject.store);
const onClickPattern = (0,external_wp_element_namespaceObject.useCallback)((pattern, blocks) => {
const patternBlocks = pattern.type === INSERTER_PATTERN_TYPES.user && pattern.syncStatus !== 'unsynced' ? [(0,external_wp_blocks_namespaceObject.createBlock)('core/block', {
onInsert((patternBlocks !== null && patternBlocks !== void 0 ? patternBlocks : []).map(block => {
const clonedBlock = (0,external_wp_blocks_namespaceObject.cloneBlock)(block);
if (clonedBlock.attributes.metadata?.categories?.includes(selectedCategory)) {
clonedBlock.attributes.metadata.categories = [selectedCategory];
createSuccessNotice((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: block pattern title. */
(0,external_wp_i18n_namespaceObject.__)('Block pattern "%s" inserted.'), pattern.title), {
id: 'block-pattern-inserted-notice'
}, [createSuccessNotice, onInsert, selectedCategory]);
return [patterns, allCategories, onClickPattern];
/* harmony default export */ const use_patterns_state = (usePatternsState);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/hooks/use-patterns-paging.js
const INITIAL_INSERTER_RESULTS = 5;
* Supplies values needed to page the patterns list client side.
* @param {Array} currentCategoryPatterns An array of the current patterns to display.
* @param {string} currentCategory The currently selected category.
* @param {Object} scrollContainerRef Ref of container to to find scroll container for when moving between pages.
* @param {string} currentFilter The currently search filter.
* @return {Object} Returns the relevant paging values. (totalItems, categoryPatternsList, numPages, changePage, currentPage)
function usePatternsPaging(currentCategoryPatterns, currentCategory, scrollContainerRef, currentFilter = '') {
const [currentPage, setCurrentPage] = (0,external_wp_element_namespaceObject.useState)(1);
const previousCategory = (0,external_wp_compose_namespaceObject.usePrevious)(currentCategory);
const previousFilter = (0,external_wp_compose_namespaceObject.usePrevious)(currentFilter);
if ((previousCategory !== currentCategory || previousFilter !== currentFilter) && currentPage !== 1) {
const totalItems = currentCategoryPatterns.length;
const pageIndex = currentPage - 1;
const categoryPatterns = (0,external_wp_element_namespaceObject.useMemo)(() => {
return currentCategoryPatterns.slice(pageIndex * PAGE_SIZE, pageIndex * PAGE_SIZE + PAGE_SIZE);
}, [pageIndex, currentCategoryPatterns]);
const categoryPatternsAsyncList = (0,external_wp_compose_namespaceObject.useAsyncList)(categoryPatterns, {
step: INITIAL_INSERTER_RESULTS
const numPages = Math.ceil(currentCategoryPatterns.length / PAGE_SIZE);
const changePage = page => {
const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(scrollContainerRef?.current);
scrollContainer?.scrollTo(0, 0);
(0,external_wp_element_namespaceObject.useEffect)(function scrollToTopOnCategoryChange() {
const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(scrollContainerRef?.current);
scrollContainer?.scrollTo(0, 0);
}, [currentCategory, scrollContainerRef]);
categoryPatternsAsyncList,
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/inserter/block-patterns-explorer/pattern-list.js