UNPKG

@braineet/ui

Version:

Braineet design system

94 lines (93 loc) 3.94 kB
"use strict"; exports.__esModule = true; exports.default = exports.CardUserRow = void 0; var _react = _interopRequireDefault(require("react")); var _styledComponents = require("styled-components"); var _avatar = _interopRequireDefault(require("../avatar")); var _styles = require("./styles"); var _jsxRuntime = require("react/jsx-runtime"); var _excluded = ["theme", "children", "user", "onClickCard", "size", "ellipsis", "boxLeftStyle"]; /** The `CardUserRow` component. */ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } var CardUserRow = exports.CardUserRow = function CardUserRow(_ref) { var _user$icon, _user$icon2; var theme = _ref.theme, children = _ref.children, user = _ref.user, onClickCard = _ref.onClickCard, size = _ref.size, ellipsis = _ref.ellipsis, boxLeftStyle = _ref.boxLeftStyle, restProps = _objectWithoutPropertiesLoose(_ref, _excluded); var infos = [{ title: user && user.jobtitle, hasDot: user && !!user.jobtitle, key: 1 }, { title: user && user.email, hasDot: user && !!user.phone, key: 2 }, { title: user && user.phone, hasDot: false, key: 3 }]; var handleMouseDown = function handleMouseDown(e) { e.preventDefault(); if (restProps.onMouseDown) { restProps.onMouseDown(e); } }; return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledBox, _extends({ onClick: onClickCard, onMouseDown: handleMouseDown, hasClickCard: children && !children.length }, restProps, { children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledBoxLeft, _extends({ ellipsis: ellipsis }, boxLeftStyle, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.default, { src: user.photo, name: user && user.fullname ? user.fullname : user && user.email, iconName: (user == null || (_user$icon = user.icon) == null ? void 0 : _user$icon.name) || null, iconColor: (user == null || (_user$icon2 = user.icon) == null ? void 0 : _user$icon2.color) || null, size: "md" }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledBoxInfo, { ellipsis: ellipsis, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledName, { ellipsis: ellipsis, size: size === 'medium' ? 'md' : 'xs', children: user && user.fullname ? user.fullname : user && user.email }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledInfoBox, { ellipsis: ellipsis, children: infos.map(function (info) { return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledInfo, { ellipsis: ellipsis, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TextInfo, { size: "sm", ellipsis: ellipsis, color: size === 'medium' ? theme.colors.black : theme.utils.lighten('black', 0.8), children: info && info.title }), info && info.hasDot && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledDot, {})] }, info.key); }) })] })] })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledBoxRight, { children: children })] })); }; CardUserRow.defaultProps = { children: null, theme: {}, boxLeftStyle: {}, size: 'medium', ellipsis: false, onClickCard: function onClickCard() {} }; var _default = exports.default = (0, _styledComponents.withTheme)(CardUserRow);