chayns-components
Version:
A set of beautiful React components for developing chayns® applications.
124 lines (121 loc) • 5.93 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _propTypes = _interopRequireDefault(require("prop-types"));
var _react = _interopRequireWildcard(require("react"));
var _FriendsIndicator = _interopRequireDefault(require("./result-item/FriendsIndicator"));
var _VerificationIcon = _interopRequireDefault(require("../../react-chayns-verification_icon/component/VerificationIcon"));
var _Checkbox = _interopRequireDefault(require("../../react-chayns-checkbox/component/Checkbox"));
var _getText = _interopRequireDefault(require("../utils/getText"));
var _constants = require("../../utils/constants");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
/* eslint-disable jsx-a11y/alt-text */
const PersonFinderResultItem = _ref => {
let {
onClick,
data,
orm,
isFocused,
roundIcons = false,
hideFriendsIcon = false,
showCheckbox = false,
tags = [],
onRemoveTag,
inputValue = '',
hideVerifiedIcon = false
} = _ref;
const selectedValue = tags === null || tags === void 0 ? void 0 : tags.find(_ref2 => {
let {
value
} = _ref2;
return value[orm.identifier] === data[orm.identifier];
});
const handleClick = (0, _react.useCallback)(() => {
if (selectedValue) {
onRemoveTag(selectedValue);
} else {
onClick({
relation: data
});
}
}, [onClick, data, selectedValue, onRemoveTag]);
let hasRelations = orm.relations && Array.isArray(data[orm.relations]) ? data[orm.relations].length > 0 : false;
if (data.relationCount !== undefined && data.relationCount !== null) {
hasRelations = true;
}
const subtitleParts = [];
if (typeof data[orm.identifier] === 'string' && data[orm.identifier].match(_constants.personIdRegex) && inputValue) {
subtitleParts.push(`chaynsID: ${data[orm.identifier]}`);
}
if (hasRelations) {
subtitleParts.push(`${data.relationCount} ${(0, _getText.default)(data.relationCount === 1 ? 'COMMON_SITE' : 'COMMON_SITES')}`);
} else if (orm.subtitle) {
subtitleParts.push(`(${data[orm.subtitle]})`);
} else if (data.isFriend && inputValue) {
subtitleParts.push('befreundet');
}
return /*#__PURE__*/_react.default.createElement("div", {
className: 'result-item' + (isFocused ? " result-item--focused" : ""),
tabIndex: "-1",
onClick: handleClick
}, showCheckbox ? /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
checked: !!selectedValue,
onChange: handleClick,
stopPropagation: true,
className: "checkbox"
}) : null, orm.imageUrl ? /*#__PURE__*/_react.default.createElement("div", {
className: 'img' + (roundIcons ? " circle" : ""),
style: {
backgroundImage: `url(${data[orm.imageUrl]})`
}
}) : null, /*#__PURE__*/_react.default.createElement("div", {
className: "text",
style: {
justifyContent: 'center'
}
}, /*#__PURE__*/_react.default.createElement("div", {
className: "title"
}, /*#__PURE__*/_react.default.createElement("div", {
className: "name"
}, orm.verified && hideVerifiedIcon !== true ? /*#__PURE__*/_react.default.createElement(_VerificationIcon.default, {
name: data[orm.showName],
verified: data[orm.verified]
}) : data[orm.showName]), hasRelations && orm.subtitle && /*#__PURE__*/_react.default.createElement("div", {
className: "identifier"
}, `(${data[orm.subtitle]})`)), /*#__PURE__*/_react.default.createElement("span", {
className: "relation"
}, subtitleParts.join(' - '))), data.personId && !hideFriendsIcon && /*#__PURE__*/_react.default.createElement(_FriendsIndicator.default, {
personId: data.personId,
userId: data.userId,
name: data[orm.showName]
}));
};
PersonFinderResultItem.propTypes = {
orm: _propTypes.default.shape({
identifier: _propTypes.default.string,
showName: _propTypes.default.string,
imageUrl: _propTypes.default.string,
relations: _propTypes.default.string,
subtitle: _propTypes.default.string,
verified: _propTypes.default.string
}).isRequired,
onClick: _propTypes.default.func.isRequired,
// eslint-disable-next-line react/forbid-prop-types
data: _propTypes.default.object.isRequired,
isFocused: _propTypes.default.bool.isRequired,
roundIcons: _propTypes.default.bool,
hideFriendsIcon: _propTypes.default.bool,
tags: _propTypes.default.arrayOf(_propTypes.default.shape({
value: _propTypes.default.shape({})
})),
showCheckbox: _propTypes.default.bool,
onRemoveTag: _propTypes.default.func.isRequired,
inputValue: _propTypes.default.string,
hideVerifiedIcon: _propTypes.default.bool
};
PersonFinderResultItem.displayName = 'PersonFinderResultItem';
var _default = PersonFinderResultItem;
exports.default = _default;
//# sourceMappingURL=PersonFinderResultItem.js.map