rc-tc-ifn
Version:
React simple. Truncate text and tooltip if need (Hooks)
2 lines (1 loc) • 3.02 kB
JavaScript
import o,{useState as e,useRef as t,useEffect as n}from"react";import i from"joinclass";import{Tooltip as r}from"react-tooltip-z";var a=function(){return a=Object.assign||function(o){for(var e,t=1,n=arguments.length;t<n;t++)for(var i in e=arguments[t])Object.prototype.hasOwnProperty.call(e,i)&&(o[i]=e[i]);return o},a.apply(this,arguments)};var l={padding:"initial",margin:"initial",display:"inline-block",whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden"},s=function(s){var c=s.children,d=s.id,p=s.className,f=s.truncateClassName,u=s.tagName,h=void 0===u?"span":u,m=s.tagTruncate,v=void 0===m?"span":m,y=s.tooltipClassName,w=s.tooltipContent,C=s.placement,g=void 0===C?"top":C,b=s.showDelay,N=void 0===b?250:b,O=s.animationDisplay,k=void 0===O?"fade":O,S=s.backgroundColor,W=s.tooltipColor,E=s.constrainWidth,j=void 0===E||E,x=s.onClick,I=void 0===x?function(){}:x,D=s.onMouseEnter,H=void 0===D?function(){}:D,M=s.onMouseLeave,z=void 0===M?function(){}:M,P=s.onShown,L=void 0===P?function(){}:P,R=s.onHidden,T=void 0===R?function(){}:R,A=s.mouseWheel,V=void 0===A||A,q=s.hideIfResize,B=void 0===q||q,F=s.hideIfScroll,G=s.top,J=s.bottom,K=s.right,Q=s.left,U=s.arrowCentered,X=s.forceHide,Y=s.width,Z=s.wrapWidth,$=function(o,e){var t={};for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&e.indexOf(n)<0&&(t[n]=o[n]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(o);i<n.length;i++)e.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(o,n[i])&&(t[n[i]]=o[n[i]])}return t}(s,["children","id","className","truncateClassName","tagName","tagTruncate","tooltipClassName","tooltipContent","placement","showDelay","animationDisplay","backgroundColor","tooltipColor","constrainWidth","onClick","onMouseEnter","onMouseLeave","onShown","onHidden","mouseWheel","hideIfResize","hideIfScroll","top","bottom","right","left","arrowCentered","forceHide","width","wrapWidth"]),_=e(!1),oo=_[0],eo=_[1],to=e(!1),no=to[0],io=to[1],ro=t(null);n((function(){var o=ro.current||{},e=o.clientWidth,t=void 0===e?0:e,n=o.scrollWidth;io(t<(void 0===n?0:n))}),[c,Y]);var ao=function(){var o=a(a({},l),$.style||{});return!o.width&&Y&&(o.width=Y),o},lo=v,so=o.Children.toArray(c)[0];return o.createElement(r,{tagName:h,className:i("dk-tooltip-if-need",p),style:{display:"inline-block",width:Z},tooltipClassName:y,tooltipContent:w||c,placement:g,trigger:"manual",backgroundColor:S,tooltipColor:W,constrainWidth:j,showDelay:N,animationDisplay:k,onClick:I,onMouseEnter:function(o){no&&eo(!0),H(o),L()},onMouseLeave:function(o){no&&eo(!1),z(o),T()},onShown:L,onHidden:function(){T(),eo(!1)},mouseWheel:V,shareContext:!1,showSync:oo,hideIfResize:B,hideIfScroll:F,top:G,bottom:J,right:K,left:Q,arrowCentered:U,forceHide:X},o.isValidElement(so)?o.cloneElement(so,a(a({},so.props),{ref:ro,className:i("dk-text-truncate",so.props.className,f),style:ao()})):o.createElement(lo,{id:d,ref:ro,className:i("dk-text-truncate",f),style:ao()},c))};export{s as TooltipIfn,s as default};