xchain-components/src/components/XSearch/index.js

Xchain Components

/* @flow */
/* eslint react/jsx-filename-extension: 0 */

import * as React from 'react';
import { Search } from 'semantic-ui-react';
import _ from 'lodash';
import './xc.css';

type OtherValues = {
   [key: string]: string | number | Object,
};

type Props = {
  isLoading: boolean,
  handleResultSelect: () => void,
  handleSearchChange: () => void,
  results: OtherValues,
  value: string,
};

const XSearch = (props: Props) => {
  const {
    isLoading, handleResultSelect, handleSearchChange, results, value,
  } = props;
  return (
    <Search
      iconPosition="left"
      loading={isLoading}
      onResultSelect={handleResultSelect}
      onSearchChange={_.debounce(handleSearchChange, 500, { leading: true })}
      results={results}
      value={value}
    />
  );
};

XSearch.defaultProps = {
};
export default XSearch;