UNPKG

azure-devops-ui

Version:

React components for building web UI in Azure DevOps

1 lines 2.27 kB
import"../../CommonImports";import"../../Core/core.css";import"./IdentityCard.css";import*as React from"react";import{format}from"../../Core/Util/String";import{Button}from"../../Button";import{Icon}from"../../Icon";import*as Resources from"../../Resources.Persona";import{Tooltip}from"../../TooltipEx";import{Persona}from"../Persona/Persona";import{PersonaSize}from"../Persona/Persona.Props";import{CardContactLine}from"./CardContactLine";const GroupCard=e=>{const{identity:t,members:a,showOrganizationCard:r}=e;var{displayName:e,mail:o,physicalDeliveryOfficeName:c,telephoneNumber:n}=t;const i=React.useRef(null),l=o||n||c;React.useEffect(()=>{l||i.current&&i.current.focus()},[]);n=format(Resources.IdentityCardMembersCount,a?a.length:0);return React.createElement("div",{className:"bolt-identity-default-card-without-header bolt-identity-card-content"},React.createElement("div",{ref:i,tabIndex:-1}),React.createElement("div",{className:"flex-row"},React.createElement(Persona,{className:"bolt-identity-card-persona-main",size:PersonaSize.size72,identity:t}),React.createElement("div",{className:"flex-column flex-grow bolt-identity-card-name scroll-hidden"},React.createElement(Tooltip,{text:e,overflowOnly:!0},React.createElement("div",{className:"word-wrap title-s"},e)),a&&0<a.length?React.createElement("div",{className:"word-wrap"},format(Resources.IdentityCardMembers,a.length)):void 0)),React.createElement("div",null,l&&React.createElement("div",{className:"bolt-identity-default-card-info-wrapper"},React.createElement("hr",{className:"bolt-identity-card-hr"}),React.createElement("div",{className:"bolt-identity-default-card-contact-info-container"},o&&React.createElement(CardContactLine,{iconName:"Mail",content:o,link:"mailto:"+o}))),a&&0<a.length?React.createElement("div",{className:"bolt-identity-default-card-member-list-wrapper "},React.createElement("hr",{className:"bolt-identity-card-hr"}),React.createElement("div",{className:"bolt-identity-default-card-header-wrapper"},React.createElement(Button,{"aria-label":n,className:"bolt-identity-default-card-header pointer bolt-profile-card-tab-element flex-center",onClick:()=>{r&&r()},role:"button",text:n,subtle:!0},React.createElement(Icon,{iconName:"ChevronRight"})))):void 0))};export{GroupCard};