// @flow
import type { Node } from 'react';
import type { TranslatedContent } from '../../../types';
import type { SpaceProps } from '../../../mixins/spacing';
import type { StackeeProps } from '../../../mixins/stackee';
import type { StylableProps } from '../../../mixins/themes';
import type { TestingProps } from '../../../mixins/testing';
import type { FocusEvents } from '../../../mixins/focus';
import type { AriaProps } from '../../../mixins/aria';
import type { FormFieldError } from '../internals/forms.proptypes';
import type { LabelStyle } from '../text-input/text-input.proptypes';

export type SearchInputProps = {|
  ...StylableProps,
  ...SpaceProps,
  ...StackeeProps,
  ...FocusEvents,
  ...TestingProps,
  ...AriaProps,
  name?: string,
  onChange: (string) => void,
  onClear?: (void) => void,
  iconPosition?: string,
  searchResults: Array<{
    id: string,
    text: string,
    isSeparator?: boolean,
  }>,
  onSearchResultClicked?: (id?: string, value?: string) => void,
  label: TranslatedContent,
  clearLabel?: string,
  allowNotFound?: boolean,
  showNotFoundOnlyOnNoResults?: boolean,
  notFoundText?: TranslatedContent,
  selected?: boolean,
  placeholder?: string,
  value?: string, // default value
  initialValue?: string,
  focusOnMount?: boolean,
  renderItem?: ({
    id: string,
    text: string,
    isSeparator?: boolean,
    selected?: boolean,
  }) => Node,
  renderNotFoundItem?: () => Node,
  clearSearchOnClick?: boolean,
  /* Optional extra information about the control */
  error?: FormFieldError,
  success?: Node,
  description?: Node,
  labelStyle?: LabelStyle,
|};
