monday-ui-react-core/dist/esm/src/components/AvatarGroup/AvatarGroupCounter.js

Official monday.com UI resources for application development in React.js

import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useRef as t,useCallback as r}from"react";import n from"classnames";import a from"../Avatar/Avatar.js";import i from"../Counter/Counter.js";import l from"../MenuButton/MenuButton.js";import s from"../Menu/Menu/Menu.js";import u from"../Menu/MenuItem/AvatarMenuItem.js";import m from"./AvatarGroupCounterTooltipContainer.js";import{getStyle as c}from"../../helpers/typesciptCssModulesHelper.js";import{avatarOnClick as p}from"./AvatarGroupHelper.js";import d from"./AvatarGroupCounter.module.scss.js";import{AVATAR_GROUP_COUNTER_AVATAR_SIZE as v}from"./AvatarGroupConstants.js";var f=function(f){var C=f.counterTooltipAvatars,b=void 0===C?[]:C,I=f.counterTooltipCustomProps,M=f.counterTooltipIsVirtualizedList,j=void 0!==M&&M,x=f.size,A=void 0===x?a.sizes.MEDIUM:x,E=f.type,P=f.counterAriaLabel,g=f.disabled,L=f.counterProps||{},z=L.color,T=void 0===z?i.colors.LIGHT:z,N=L.count,h=void 0===N?b.length:N,y=L.prefix,G=void 0===y?"+":y,D=L.maxDigits,H=void 0===D?3:D,k=L.ariaLabelItemsName,B=void 0===k?"items":k,O=L.noAnimation,R=L.dialogContainerSelector,S=c(d,null==A?void 0:""+A),U=d[T],V=t(null),_=t(null),q=t(null),w=r((function(){return o.createElement(i,{color:T,count:h,prefix:G,maxDigits:H,ariaLabel:P||"Tab for more ".concat(B),noAnimation:O,counterClassName:n(e({},d.disabled,g))})}),[P,B,T,H,G,h,g,O]);return b.length||h?g?o.createElement("div",{ref:q,className:n(d.counterContainer,d.disabled,S,U)},w()):b.some((function(e){var o;return null===(o=e.props)||void 0===o?void 0:o.onClick}))?o.createElement(l,{component:w,zIndex:1,className:n(d.counterContainer,S,U),ariaLabel:P||"".concat(h," additional ").concat(B),dialogContainerSelector:R},o.createElement(s,{id:"menu",size:s.sizes.MEDIUM,className:d.menu,focusItemIndexOnMount:0},b.map((function(e,t){var r,n,a,i;return o.createElement(u,{menuItemProps:{key:(null===(r=e.props)||void 0===r?void 0:r.id)||t+"",title:(null===(a=null===(n=e.props)||void 0===n?void 0:n.tooltipProps)||void 0===a?void 0:a.content)||(null===(i=null==e?void 0:e.props)||void 0===i?void 0:i.ariaLabel),onClick:function(o){return p(o,e.props)}},avatarProps:Object.assign(Object.assign({},e.props),{customSize:v,ariaLabel:"",tabIndex:-1})})})))):o.createElement(m,{focusPrevPlaceholderRef:V,focusNextPlaceholderRef:_,counterContainerRef:q,avatars:b,counterTooltipCustomProps:I,counterTooltipIsVirtualizedList:j,type:E},o.createElement("div",{tabIndex:-1,ref:V}),o.createElement("div",{tabIndex:0,className:n(d.counterContainer,S,U),ref:q},w(),o.createElement("div",{tabIndex:-1,ref:_}))):null};export{f as default};
//# sourceMappingURL=AvatarGroupCounter.js.map