@chayns-components/person-finder
Version:
A set of beautiful React components for developing your own applications with chayns.
37 lines • 1.07 kB
JavaScript
import React from 'react';
import { usePersonFinderSmallItem } from '../../../../../../hooks/personFinder';
import { usePersonFinder } from '../../../../../PersonFinderProvider';
import { StyledPersonFinderSmallItem } from './PersonFinderSmallItem.styles';
const PersonFinderSmallItem = ({
entry,
onAdd,
onRemove
}) => {
const {
id: entryId
} = entry;
const id = typeof entryId === 'string' ? entryId : entryId.toString();
const {
title
} = usePersonFinderSmallItem(entry);
const {
tags
} = usePersonFinder();
const isSelected = tags && tags.map(tag => tag.id).includes(id);
const handleClick = event => {
event.preventDefault();
event.stopPropagation();
if (isSelected) {
onRemove(id);
} else {
onAdd(id);
}
};
return /*#__PURE__*/React.createElement(StyledPersonFinderSmallItem, {
onClick: handleClick,
$isSelected: isSelected
}, title);
};
PersonFinderSmallItem.displayName = 'PersonFinderSmallItem';
export default PersonFinderSmallItem;
//# sourceMappingURL=PersonFinderSmallItem.js.map