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

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

/**
 * @jsxRuntime classic
 * @jsx jsx
 */
import { PureComponent } from 'react';

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css, jsx } from '@emotion/react';
import Spinner from '@atlaskit/spinner';
import LinkSearchListItem from './LinkSearchListItem';
const listContainer = css({
  paddingTop: 0,
  marginTop: "var(--ds-space-150, 12px)",
  borderTop: `1px solid ${"var(--ds-border, #091E4224)"}`
});
const spinnerContainer = 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
export const linkSearchList = css({
  padding: 0,
  listStyle: 'none'
});
// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/react/no-class-components
export default class LinkSearchList extends PureComponent {
  render() {
    const {
      onSelect,
      onMouseMove,
      onMouseEnter,
      onMouseLeave,
      items,
      selectedIndex,
      isLoading,
      ariaControls,
      role,
      id
    } = this.props;
    let itemsContent;
    let loadingContent;
    if (items && items.length > 0) {
      itemsContent = jsx("ul", {
        css: linkSearchList,
        id: id,
        role: role,
        "aria-controls": ariaControls
      }, items.map((item, index) => jsx(LinkSearchListItem, {
        id: `link-search-list-item-${index}`,
        role: role && 'option',
        item: item,
        selected: selectedIndex === index,
        onMouseMove: onMouseMove,
        onMouseEnter: onMouseEnter,
        onMouseLeave: onMouseLeave,
        onSelect: onSelect,
        key: item.objectId
      })));
    }
    if (isLoading) {
      loadingContent = jsx("div", {
        "data-testid": `${id}-loading`,
        css: spinnerContainer
      }, jsx(Spinner, {
        size: "medium"
      }));
    }
    return jsx("div", {
      css: listContainer
    }, itemsContent, loadingContent);
  }
}