UNPKG

@wordpress/block-editor

Version:
229 lines (227 loc) 8.95 kB
"use strict"; var __create = Object.create; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __getProtoOf = Object.getPrototypeOf; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod )); var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // packages/block-editor/src/components/inserter/search-results.js var search_results_exports = {}; __export(search_results_exports, { default: () => search_results_default }); module.exports = __toCommonJS(search_results_exports); var import_element = require("@wordpress/element"); var import_i18n = require("@wordpress/i18n"); var import_components = require("@wordpress/components"); var import_compose = require("@wordpress/compose"); var import_a11y = require("@wordpress/a11y"); var import_data = require("@wordpress/data"); var import_block_types_list = __toESM(require("../block-types-list/index.cjs")); var import_block_patterns_list = __toESM(require("../block-patterns-list/index.cjs")); var import_inserter_menu_extension = __toESM(require("../inserter-menu-extension/index.cjs")); var import_panel = __toESM(require("./panel.cjs")); var import_no_results = __toESM(require("./no-results.cjs")); var import_use_insertion_point = __toESM(require("./hooks/use-insertion-point.cjs")); var import_use_patterns_state = __toESM(require("./hooks/use-patterns-state.cjs")); var import_use_block_types_state = __toESM(require("./hooks/use-block-types-state.cjs")); var import_search_items = require("./search-items.cjs"); var import_inserter_listbox = __toESM(require("../inserter-listbox/index.cjs")); var import_sorting = require("../../utils/sorting.cjs"); var import_order_inserter_block_items = require("../../utils/order-inserter-block-items.cjs"); var import_store = require("../../store/index.cjs"); var import_jsx_runtime = require("react/jsx-runtime"); var INITIAL_INSERTER_RESULTS = 9; var EMPTY_ARRAY = []; function InserterSearchResults({ filterValue, onSelect, onHover, onHoverPattern, rootClientId, clientId, isAppender, __experimentalInsertionIndex, maxBlockPatterns, maxBlockTypes, showBlockDirectory = false, isDraggable = true, shouldFocusBlock = true, prioritizePatterns, selectBlockOnInsert, isQuick }) { const debouncedSpeak = (0, import_compose.useDebounce)(import_a11y.speak, 500); const { prioritizedBlocks } = (0, import_data.useSelect)( (select) => { const blockListSettings = select(import_store.store).getBlockListSettings(rootClientId); return { prioritizedBlocks: blockListSettings?.prioritizedInserterBlocks || EMPTY_ARRAY }; }, [rootClientId] ); const [destinationRootClientId, onInsertBlocks] = (0, import_use_insertion_point.default)({ onSelect, rootClientId, clientId, isAppender, insertionIndex: __experimentalInsertionIndex, shouldFocusBlock, selectBlockOnInsert }); const [ blockTypes, blockTypeCategories, blockTypeCollections, onSelectBlockType ] = (0, import_use_block_types_state.default)(destinationRootClientId, onInsertBlocks, isQuick); const [patterns, , onClickPattern] = (0, import_use_patterns_state.default)( onInsertBlocks, destinationRootClientId, void 0, isQuick ); const filteredBlockPatterns = (0, import_element.useMemo)(() => { if (maxBlockPatterns === 0) { return []; } const results = (0, import_search_items.searchItems)(patterns, filterValue); return maxBlockPatterns !== void 0 ? results.slice(0, maxBlockPatterns) : results; }, [filterValue, patterns, maxBlockPatterns]); let maxBlockTypesToShow = maxBlockTypes; if (prioritizePatterns && filteredBlockPatterns.length > 2) { maxBlockTypesToShow = 0; } const filteredBlockTypes = (0, import_element.useMemo)(() => { if (maxBlockTypesToShow === 0) { return []; } const nonPatternBlockTypes = blockTypes.filter( (blockType) => blockType.name !== "core/block" ); let orderedItems = (0, import_sorting.orderBy)(nonPatternBlockTypes, "frecency", "desc"); if (!filterValue && prioritizedBlocks.length) { orderedItems = (0, import_order_inserter_block_items.orderInserterBlockItems)( orderedItems, prioritizedBlocks ); } const results = (0, import_search_items.searchBlockItems)( orderedItems, blockTypeCategories, blockTypeCollections, filterValue ); return maxBlockTypesToShow !== void 0 ? results.slice(0, maxBlockTypesToShow) : results; }, [ filterValue, blockTypes, blockTypeCategories, blockTypeCollections, maxBlockTypesToShow, prioritizedBlocks ]); (0, import_element.useEffect)(() => { if (!filterValue) { return; } const count = filteredBlockTypes.length + filteredBlockPatterns.length; const resultsFoundMessage = (0, import_i18n.sprintf)( /* translators: %d: number of results. */ (0, import_i18n._n)("%d result found.", "%d results found.", count), count ); debouncedSpeak(resultsFoundMessage); }, [ filterValue, debouncedSpeak, filteredBlockTypes, filteredBlockPatterns ]); const currentShownBlockTypes = (0, import_compose.useAsyncList)(filteredBlockTypes, { step: INITIAL_INSERTER_RESULTS }); const hasItems = filteredBlockTypes.length > 0 || filteredBlockPatterns.length > 0; const blocksUI = !!filteredBlockTypes.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_panel.default, { title: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { children: (0, import_i18n.__)("Blocks") }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_block_types_list.default, { items: currentShownBlockTypes, onSelect: onSelectBlockType, onHover, label: (0, import_i18n.__)("Blocks"), isDraggable } ) } ); const patternsUI = !!filteredBlockPatterns.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_panel.default, { title: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { children: (0, import_i18n.__)("Block patterns") }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "block-editor-inserter__quick-inserter-patterns", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_block_patterns_list.default, { blockPatterns: filteredBlockPatterns, onClickPattern, onHover: onHoverPattern, isDraggable } ) }) } ); return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_inserter_listbox.default, { children: [ !showBlockDirectory && !hasItems && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_no_results.default, {}), prioritizePatterns ? patternsUI : blocksUI, !!filteredBlockTypes.length && !!filteredBlockPatterns.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "block-editor-inserter__quick-inserter-separator" }), prioritizePatterns ? blocksUI : patternsUI, showBlockDirectory && /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_inserter_menu_extension.default.Slot, { fillProps: { onSelect: onSelectBlockType, onHover, filterValue, hasItems, rootClientId: destinationRootClientId }, children: (fills) => { if (fills.length) { return fills; } if (!hasItems) { return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_no_results.default, {}); } return null; } } ) ] }); } var search_results_default = InserterSearchResults; //# sourceMappingURL=search-results.cjs.map