@primer/components/lib-esm/Autocomplete/Autocomplete.js

Primer react components

import React, { useRef, useState } from 'react';
import { uniqueId } from '../utils/uniqueId';
import { AutocompleteContext } from './AutocompleteContext';
import AutocompleteInput from './AutocompleteInput';
import AutocompleteMenu from './AutocompleteMenu';
import AutocompleteOverlay from './AutocompleteOverlay';

const Autocomplete = ({
  children,
  id: idProp
}) => {
  const activeDescendantRef = useRef(null);
  const scrollContainerRef = useRef(null);
  const inputRef = useRef(null);
  const [inputValue, setInputValue] = useState('');
  const [showMenu, setShowMenu] = useState(false);
  const [autocompleteSuggestion, setAutocompleteSuggestion] = useState('');
  const [isMenuDirectlyActivated, setIsMenuDirectlyActivated] = useState(false);
  const [selectedItemLength, setSelectedItemLength] = useState();
  const id = idProp || uniqueId();
  return /*#__PURE__*/React.createElement(AutocompleteContext.Provider, {
    value: {
      activeDescendantRef,
      autocompleteSuggestion,
      id,
      inputRef,
      inputValue,
      isMenuDirectlyActivated,
      scrollContainerRef,
      selectedItemLength,
      setAutocompleteSuggestion,
      setInputValue,
      setIsMenuDirectlyActivated,
      setShowMenu,
      setSelectedItemLength,
      showMenu
    }
  }, children);
};

Autocomplete.displayName = "Autocomplete";
export default Object.assign(Autocomplete, {
  AutocompleteContext,
  Input: AutocompleteInput,
  Menu: AutocompleteMenu,
  Overlay: AutocompleteOverlay
});