@wordpress/block-editor/build/components/link-control/search-results.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = LinkControlSearchResults;

var _element = require("@wordpress/element");

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _i18n = require("@wordpress/i18n");

var _components = require("@wordpress/components");

var _classnames = _interopRequireDefault(require("classnames"));

var _searchCreateButton = _interopRequireDefault(require("./search-create-button"));

var _searchItem = _interopRequireDefault(require("./search-item"));

var _constants = require("./constants");

/**
 * WordPress dependencies
 */

/**
 * External dependencies
 */

/**
 * Internal dependencies
 */
function LinkControlSearchResults({
  instanceId,
  withCreateSuggestion,
  currentInputValue,
  handleSuggestionClick,
  suggestionsListProps,
  buildSuggestionItemProps,
  suggestions,
  selectedSuggestion,
  isLoading,
  isInitialSuggestions,
  createSuggestionButtonText,
  suggestionsQuery
}) {
  const resultsListClasses = (0, _classnames.default)('block-editor-link-control__search-results', {
    'is-loading': isLoading
  });

  const isSingleDirectEntryResult = suggestions.length === 1 && _constants.LINK_ENTRY_TYPES.includes(suggestions[0].type);

  const shouldShowCreateSuggestion = withCreateSuggestion && !isSingleDirectEntryResult && !isInitialSuggestions; // If the query has a specified type, then we can skip showing them in the result. See #24839.

  const shouldShowSuggestionsTypes = !suggestionsQuery?.type; // According to guidelines aria-label should be added if the label
  // itself is not visible.
  // See: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role

  const searchResultsLabelId = `block-editor-link-control-search-results-label-${instanceId}`;
  const labelText = isInitialSuggestions ? (0, _i18n.__)('Suggestions') : (0, _i18n.sprintf)(
  /* translators: %s: search term. */
  (0, _i18n.__)('Search results for "%s"'), currentInputValue);
  const searchResultsLabel = (0, _element.createElement)(_components.VisuallyHidden, {
    id: searchResultsLabelId
  }, labelText);
  return (0, _element.createElement)("div", {
    className: "block-editor-link-control__search-results-wrapper"
  }, searchResultsLabel, (0, _element.createElement)("div", (0, _extends2.default)({}, suggestionsListProps, {
    className: resultsListClasses,
    "aria-labelledby": searchResultsLabelId
  }), suggestions.map((suggestion, index) => {
    if (shouldShowCreateSuggestion && _constants.CREATE_TYPE === suggestion.type) {
      return (0, _element.createElement)(_searchCreateButton.default, {
        searchTerm: currentInputValue,
        buttonText: createSuggestionButtonText,
        onClick: () => handleSuggestionClick(suggestion) // Intentionally only using `type` here as
        // the constant is enough to uniquely
        // identify the single "CREATE" suggestion.
        ,
        key: suggestion.type,
        itemProps: buildSuggestionItemProps(suggestion, index),
        isSelected: index === selectedSuggestion
      });
    } // If we're not handling "Create" suggestions above then
    // we don't want them in the main results so exit early.


    if (_constants.CREATE_TYPE === suggestion.type) {
      return null;
    }

    return (0, _element.createElement)(_searchItem.default, {
      key: `${suggestion.id}-${suggestion.type}`,
      itemProps: buildSuggestionItemProps(suggestion, index),
      suggestion: suggestion,
      index: index,
      onClick: () => {
        handleSuggestionClick(suggestion);
      },
      isSelected: index === selectedSuggestion,
      isURL: _constants.LINK_ENTRY_TYPES.includes(suggestion.type),
      searchTerm: currentInputValue,
      shouldShowType: shouldShowSuggestionsTypes,
      isFrontPage: suggestion?.isFrontPage
    });
  })));
}
//# sourceMappingURL=search-results.js.map