import classNames from 'classnames';
import React, { PropTypes } from 'react';

function AutocompleteOption({ item, theme }) {
  return (
    <div className={classNames('c-kd-autocomplete-option', theme['c-kd-autocomplete-option'])}>
      <div className={classNames('o-pack o-pack--middle', theme['o-pack o-pack--middle'])}>
        <div className={classNames('o-pack__item', theme['o-pack__item u-padding-small'])}>
          <span className={classNames('c-kd-autocomplete-option__title', theme['c-kd-autocomplete-option__title'])}>{item.label}</span>
        </div>
      </div>
    </div>
  );
}

AutocompleteOption.propTypes = {
  theme: PropTypes.oneOfType([
    PropTypes.object,
    PropTypes.func,
  ]).isRequired,
  item: PropTypes.shape({
    label: PropTypes.string,
    value: PropTypes.string,
  }),
};

export default AutocompleteOption;
