wix-style-react/dist/es/src/ContactItemBuilder/ContactItemBuilder.js

wix-style-react

import React from 'react';
import styles from './ContactItemBuilder.scss';
import Avatar from '../Avatar/Avatar';
import Text from '../Text';
import { dataHooks } from './ContactItemBuilderDataHooks';
import PropTypes from 'prop-types';

export var ContactItem = function ContactItem(props) {
  return React.createElement(
    'div',
    { className: styles.contactItemOption },
    React.createElement(
      'div',
      { className: styles.avatar },
      React.createElement(Avatar, {
        name: props.title,
        size: 'size30',
        imgProps: { src: props.imageUrl },
        'data-hook': dataHooks.pickerOptionAvatar
      })
    ),
    React.createElement(
      'div',
      { className: styles.contactItemTitles },
      React.createElement(
        Text,
        {
          ellipsis: true,
          size: 'medium',
          weight: 'normal',
          secondary: !props.selected,
          light: props.selected,
          dataHook: dataHooks.pickerOptionTitle
        },
        props.title
      ),
      props.subtitle ? React.createElement(
        Text,
        {
          ellipsis: true,
          size: 'small',
          weight: 'thin',
          secondary: !props.selected,
          light: props.selected,
          dataHook: dataHooks.pickerOptionSubtitle
        },
        props.subtitle
      ) : null
    )
  );
};

ContactItem.propTypes = {
  title: PropTypes.string.isRequired,
  subtitle: PropTypes.string,
  imageUrl: PropTypes.string
};

export var contactItemBuilder = function contactItemBuilder(_ref) {
  var id = _ref.id,
      title = _ref.title,
      subtitle = _ref.subtitle,
      imageUrl = _ref.imageUrl;
  return {
    id: id,
    value: function value(_ref2) {
      var selected = _ref2.selected;
      return React.createElement(ContactItem, {
        title: title,
        subtitle: subtitle,
        imageUrl: imageUrl,
        selected: selected
      });
    }
  };
};