@chayns-components/core
Version:
A set of beautiful React components for developing your own applications with chayns.
23 lines • 1.25 kB
JavaScript
import React, { useCallback } from 'react';
import { StyledMentionFinderItem, StyledMentionFinderItemContent, StyledMentionFinderItemContentInfo, StyledMentionFinderItemContentName, StyledMentionFinderItemImage } from './MentionFinderItem.styles';
const MentionFinderItem = ({
isActive,
member,
onClick,
onHover
}) => {
const handleItemClick = useCallback(() => onClick(member), [member, onClick]);
const handleItemMouseEnter = useCallback(() => onHover(member), [member, onHover]);
return /*#__PURE__*/React.createElement(StyledMentionFinderItem, {
className: "prevent-lose-focus",
onClick: handleItemClick,
onMouseEnter: handleItemMouseEnter,
$isActive: isActive
}, /*#__PURE__*/React.createElement(StyledMentionFinderItemImage, {
src: member.imageUrl,
$shouldShowRoundImage: member.shouldShowRoundImage
}), /*#__PURE__*/React.createElement(StyledMentionFinderItemContent, null, /*#__PURE__*/React.createElement(StyledMentionFinderItemContentName, null, member.name), member.info && /*#__PURE__*/React.createElement(StyledMentionFinderItemContentInfo, null, member.info)));
};
MentionFinderItem.displayName = 'MentionFinderItem';
export default MentionFinderItem;
//# sourceMappingURL=MentionFinderItem.js.map