@gravity-ui/uikit
Version:
Gravity UI base styling and components
32 lines (31 loc) • 2.13 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.User = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const Avatar_1 = require("../Avatar/index.js");
const cn_1 = require("../utils/cn.js");
const filterDOMProps_1 = require("../utils/filterDOMProps.js");
const constants_1 = require("./constants.js");
require("./User.css");
const b = (0, cn_1.block)('user');
exports.User = React.forwardRef((props, ref) => {
const { avatar, name, description, size = constants_1.DEFAULT_USER_SIZE, className, style, qa } = props;
const nameTitle = typeof name === 'string' ? name : undefined;
const descriptionTitle = typeof description === 'string' ? description : undefined;
let avatarView = null;
if (typeof avatar === 'string') {
avatarView = (0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { imgUrl: avatar, size: size, title: nameTitle });
}
else if (React.isValidElement(avatar)) {
avatarView = avatar;
}
else if (avatar) {
avatarView = (0, jsx_runtime_1.jsx)(Avatar_1.Avatar, { ...avatar, size: size, title: avatar.title || nameTitle });
}
const showDescription = Boolean(description && !constants_1.COMPACT_SIZES.has(size));
return ((0, jsx_runtime_1.jsxs)("div", { className: b({ size }, className), style: style, "data-qa": qa, ref: ref, ...(0, filterDOMProps_1.filterDOMProps)(props, { labelable: true }), children: [avatarView ? (0, jsx_runtime_1.jsx)("div", { className: b('avatar'), children: avatarView }) : null, name || showDescription ? ((0, jsx_runtime_1.jsxs)("div", { className: b('info'), children: [name ? ((0, jsx_runtime_1.jsx)("span", { className: b('name'), title: nameTitle, "data-qa": constants_1.UserQa.NAME, children: name })) : null, showDescription ? ((0, jsx_runtime_1.jsx)("span", { className: b('description'), title: descriptionTitle, "data-qa": constants_1.UserQa.DESCRIPTION, children: description })) : null] })) : null] }));
});
exports.User.displayName = 'User';
//# sourceMappingURL=User.js.map