monday-ui-react-core
Version:
Official monday.com UI resources for application development in React.js
3 lines (2 loc) • 3.47 kB
JavaScript
import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{isNil as t,camelCase as r}from"lodash-es";import{getStyle as o}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as a,ComponentDefaultTestId as s}from"../../tests/testIds.js";import i from"classnames";import l,{useMemo as n,useCallback as c}from"react";import{backwardCompatibilityForProperties as d}from"../../helpers/backwardCompatibilityForProperties.js";import{ElementAllowedColor as m,getElementColor as p}from"../../utils/colors-vars-map.js";import{AvatarType as g,AvatarSize as b}from"./AvatarConstants.js";import{AvatarBadge as u}from"./AvatarBadge.js";import{AvatarContent as f}from"./AvatarContent.js";import h from"../Tooltip/Tooltip.js";import v from"../Clickable/ClickableWrapper.js";import{withStaticProps as E}from"../../types/withStaticProps.js";import C from"./Avatar.module.scss.js";var j=E((function m(E){var j=E.id,k=E.type,T=void 0===k?g.TEXT:k,y=E.className,B=E.avatarContentWrapperClassName,N=E.textClassName,w=void 0===N?"":N,L=E.size,O=void 0===L?b.LARGE:L,P=E.src,S=E.icon,A=E.text,x=E.tooltipProps,z=E.ariaLabel,R=E.withoutTooltip,I=void 0!==R&&R,U=E.role,_=E.backgroundColor,H=void 0===_?m.colors.CHILI_BLUE:_,q=E.disabled,M=E.isDisabled,W=E.tabIndex,D=E.ariaHidden,F=void 0!==D&&D,V=E.topLeftBadgeProps,G=E.topRightBadgeProps,X=E.bottomLeftBadgeProps,J=E.bottomRightBadgeProps,K=E.withoutBorder,Q=void 0!==K&&K,Y=E.customSize,Z=void 0===Y?null:Y,$=E.customBackgroundColor,ee=void 0===$?null:$,te=E.onClick,re=E["data-testid"],oe=d([E.square,E.isSquare]),ae=d([q,M],!1),se=n((function(){return ee?{backgroundColor:ee}:P?{}:{backgroundColor:p(H)}}),[P,H,ee]),ie=n((function(){return Z?{height:Z,width:Z}:{}}),[Z]),le=n((function(){if(!I)return x?Object.assign({content:z},x):{content:z}}),[z,x,I]),ne=n((function(){var e=[];return t(V)||e.push(l.createElement("div",{key:"top-left-badge",className:i(C.badge,C.badgeTopLeft)},l.createElement(u,Object.assign({size:O},V)))),t(G)||e.push(l.createElement("div",{key:"top-right-badge",className:i(C.badge,C.badgeTopRight)},l.createElement(u,Object.assign({size:O},G)))),t(X)||e.push(l.createElement("div",{key:"bottom-left-badge",className:i(C.badge,C.badgeBottomLeft)},l.createElement(u,Object.assign({size:O},X)))),t(J)||e.push(l.createElement("div",{key:"bottom-right-bade",className:i(C.badge,C.badgeBottomRight)},l.createElement(u,Object.assign({size:O},J)))),e.length>0?l.createElement("div",{className:i(C.badges)},e):null}),[O,V,G,X,J]),ce=n((function(){return q||!te&&!(null==le?void 0:le.content)?-1:0}),[q,te,null==le?void 0:le.content]),de=null!=W?W:ce,me=c((function(e){e.preventDefault(),te&&te(e,j)}),[te,j]);return l.createElement("div",{id:j,"data-testid":re||a(s.AVATAR,j),className:i(C.avatar,C[O],y),style:ie},l.createElement(v,{isClickable:!!te,clickableProps:{onClick:me,tabIndex:"-1",className:C.clickableWrapper}},l.createElement(h,Object.assign({showTrigger:[h.hideShowTriggers.FOCUS,h.hideShowTriggers.MOUSE_ENTER],hideTrigger:[h.hideShowTriggers.BLUR,h.hideShowTriggers.MOUSE_LEAVE]},le),l.createElement("div",{className:i(C.circle,o(C,r("circle--"+T)),e(e(e({},C.disabled,ae),C.square,oe),C.withoutBorder,Q),B),"aria-hidden":F,tabIndex:de,style:Object.assign({},se)},l.createElement(f,{type:T,size:O,src:P,icon:S,text:A,ariaLabel:z,role:U,textClassName:w})),ne)))}),{types:g,sizes:b,colors:m,backgroundColors:m});export{j as default};
//# sourceMappingURL=Avatar.js.map