import { Avatar } from '@8base/boost';
import React from 'react';

import css from './user-select.module.css';

// -- MAIN

function Option(props: any) {
  const { data, innerProps } = props;
  const style = {
    display: 'flex',
    alignItems: 'center',
  };

  return (
    <div {...innerProps} style={style}>
      <Avatar
        className={css['option-avatar']}
        src={data.src}
        size="sm"
        firstName={data.firstName}
        lastName={data.lastName}
      />
      <span>{data.label}</span>
    </div>
  );
}

export default Option;