@atlaskit/editor-common/dist/cjs/link/LinkSearch/LinkSearchList.js

A package that contains common classes and components for editor and renderer

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.linkSearchList = exports.default = void 0;
var _react = require("@emotion/react");
var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
var _LinkSearchListItem = _interopRequireDefault(require("./LinkSearchListItem"));
/* eslint-disable @atlaskit/ui-styling-standard/use-compiled -- Pre-existing lint debt surfaced by this mechanical type-import-only PR. */
/**
 * @jsxRuntime classic
 * @jsx jsx
 */

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic

var listContainer = (0, _react.css)({
  paddingTop: 0,
  marginTop: "var(--ds-space-150, 12px)",
  borderTop: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)")
});
var spinnerContainer = (0, _react.css)({
  textAlign: 'center',
  minHeight: '80px',
  marginTop: "var(--ds-space-400, 32px)"
});

// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
var linkSearchList = exports.linkSearchList = (0, _react.css)({
  padding: 0,
  listStyle: 'none'
});
var LinkSearchList = function LinkSearchList(_ref) {
  var listItemRefCallback = _ref.listItemRefCallback,
    onBlur = _ref.onBlur,
    _onFocus = _ref.onFocus,
    onKeyDown = _ref.onKeyDown,
    onSelect = _ref.onSelect,
    onMouseMove = _ref.onMouseMove,
    onMouseEnter = _ref.onMouseEnter,
    onMouseLeave = _ref.onMouseLeave,
    items = _ref.items,
    selectedIndex = _ref.selectedIndex,
    isLoading = _ref.isLoading,
    ariaControls = _ref.ariaControls,
    role = _ref.role,
    id = _ref.id;
  var itemsContent;
  var loadingContent;
  if (items && items.length > 0) {
    itemsContent = (0, _react.jsx)("ul", {
      css: linkSearchList,
      id: id,
      role: role,
      "aria-controls": ariaControls,
      "data-testid": "".concat(id, "--items")
    }, items.map(function (item, index) {
      return (0, _react.jsx)(_LinkSearchListItem.default, {
        id: "link-search-list-item-".concat(index),
        item: item,
        selected: selectedIndex === index,
        onBlur: onBlur
        // eslint-disable-next-line @atlassian/perf-linting/detect-unnecessary-rerenders, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
        ,
        onFocus: function onFocus() {
          return _onFocus === null || _onFocus === void 0 ? void 0 : _onFocus(index);
        },
        onKeyDown: onKeyDown,
        onMouseMove: onMouseMove,
        onMouseEnter: onMouseEnter,
        onMouseLeave: onMouseLeave,
        onSelect: onSelect,
        key: item.objectId
        // eslint-disable-next-line @atlassian/perf-linting/detect-unnecessary-rerenders, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
        ,
        ref: function ref(el) {
          return listItemRefCallback === null || listItemRefCallback === void 0 ? void 0 : listItemRefCallback(el, item.objectId);
        }
      });
    }));
  }
  if (isLoading) {
    loadingContent = (0, _react.jsx)("div", {
      id: id,
      "data-testid": "".concat(id, "--loading"),
      css: spinnerContainer
    }, (0, _react.jsx)(_spinner.default, {
      size: "medium",
      interactionName: "link-search-spinner"
    }));
  }
  return (0, _react.jsx)("div", {
    css: listContainer
  }, itemsContent, loadingContent);
};
var _default = exports.default = LinkSearchList;