@zohodesk/components
Version:
In this Package, we Provide Some Basic Components to Build Web App
167 lines (141 loc) • 8.49 kB
JavaScript
"use strict";
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _react = _interopRequireWildcard(require("react"));
var _Layout = require("../Layout");
var _ListContainer = _interopRequireDefault(require("./ListContainer"));
var _defaultProps = require("./props/defaultProps");
var _propTypes = require("./props/propTypes");
var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
var _AvatarTeam = _interopRequireDefault(require("../AvatarTeam/AvatarTeam"));
var _icons = require("@zohodesk/icons");
var _ListItemModule = _interopRequireDefault(require("../../ListItem/ListItem.module.css"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var ListItemWithAvatar = function ListItemWithAvatar(props) {
var size = props.size,
active = props.active,
highlight = props.highlight,
value = props.value,
name = props.name,
imgSrc = props.imgSrc,
autoHover = props.autoHover,
isTeam = props.isTeam,
palette = props.palette,
title = props.title,
needTick = props.needTick,
dataId = props.dataId,
dataSelectorId = props.dataSelectorId,
initial = props.initial,
isDisabled = props.isDisabled,
needBorder = props.needBorder,
disableTitle = props.disableTitle,
needAvatarTitle = props.needAvatarTitle,
avatarPalette = props.avatarPalette,
a11y = props.a11y,
customClass = props.customClass,
customProps = props.customProps,
needMultiLineText = props.needMultiLineText,
index = props.index,
id = props.id,
getRef = props.getRef,
onClick = props.onClick,
onMouseEnter = props.onMouseEnter;
function handleRef(ele) {
getRef && getRef(ele, index, id);
}
function handleClick(e) {
onClick && onClick(id, value, index, e);
}
function handleMouseEnter(e) {
onMouseEnter && onMouseEnter(id, value, index, e);
}
var _customProps$ListItem = customProps.ListItemProps,
ListItemProps = _customProps$ListItem === void 0 ? {} : _customProps$ListItem,
_customProps$Containe = customProps.ContainerProps,
ContainerProps = _customProps$Containe === void 0 ? {} : _customProps$Containe;
var _customClass$customLi = customClass.customListItem,
customListItem = _customClass$customLi === void 0 ? '' : _customClass$customLi,
_customClass$customAv = customClass.customAvatar,
customAvatar = _customClass$customAv === void 0 ? '' : _customClass$customAv,
_customClass$customAv2 = customClass.customAvatarTeam,
customAvatarTeam = _customClass$customAv2 === void 0 ? '' : _customClass$customAv2;
var listA11y = _objectSpread({
ariaHidden: true,
role: 'option'
}, a11y);
var ariaHidden = listA11y.ariaHidden;
var isDarkPalette = palette === 'dark';
var dataIdString = value ? value : dataId;
return /*#__PURE__*/_react["default"].createElement(_ListContainer["default"], _extends({
a11y: listA11y,
size: size,
palette: palette,
highlight: highlight,
isDisabled: isDisabled,
active: active,
autoHover: autoHover,
needTick: needTick,
needBorder: needBorder,
customClass: customListItem,
dataId: "".concat(dataIdString, "_ListItemWithAvatar"),
dataSelectorId: "".concat(dataSelectorId),
onClick: handleClick,
onMouseEnter: handleMouseEnter,
eleRef: handleRef,
disableTitle: disableTitle,
title: null,
customProps: ListItemProps
}, ContainerProps), name || imgSrc ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
className: _ListItemModule["default"].leftAvatar
}, isTeam ? /*#__PURE__*/_react["default"].createElement(_AvatarTeam["default"], {
name: name,
size: "small",
src: imgSrc,
needTitle: needAvatarTitle,
textPalette: isDarkPalette ? 'white' : '',
palette: isDarkPalette ? 'info' : avatarPalette,
customClass: {
customAvatar: customAvatar,
customAvatarTeam: customAvatarTeam
}
}) : /*#__PURE__*/_react["default"].createElement(_Avatar["default"], {
name: name,
size: "small",
src: imgSrc,
initial: initial,
textPalette: isDarkPalette ? 'white' : '',
needTitle: needAvatarTitle,
palette: isDarkPalette ? 'info' : avatarPalette,
customClass: customAvatar
})) : null, value ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
flexible: true,
shrink: true,
"data-title": isDisabled ? null : title,
className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
}, value) : null, needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
className: _ListItemModule["default"].tickIcon,
"aria-hidden": ariaHidden,
dataId: "".concat(dataIdString, "_tickIcon"),
dataSelectorId: "".concat(dataSelectorId, "_tickIcon")
}, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
name: "ZD-ticknew",
size: "8"
})) : null);
};
ListItemWithAvatar.defaultProps = _defaultProps.ListItemWithAvatarDefaultProps;
ListItemWithAvatar.propTypes = _propTypes.ListItemWithAvatar_Props;
var MemoizedListItemWithAvatar = /*#__PURE__*/(0, _react.memo)(ListItemWithAvatar);
MemoizedListItemWithAvatar.propTypes = _propTypes.ListItemWithAvatar_Props;
MemoizedListItemWithAvatar.defaultProps = _defaultProps.ListItemWithAvatarDefaultProps;
MemoizedListItemWithAvatar.displayName = 'ListItemWithAvatar';
var _default = MemoizedListItemWithAvatar;
exports["default"] = _default;