vdk-components
Version:
React component library built with TypeScript and SCSS
3 lines (2 loc) • 1.24 kB
JavaScript
;var t=require("react/jsx-runtime"),e=require("react");exports.Tooltip=function(o){var i,r=o.content,n=o.children,c=o.position,l=void 0===c?"top":c,u=o.delay,s=void 0===u?0:u,a=o.className,f=void 0===a?"":a,h=e.useState(!1),p=h[0],d=h[1],g=e.useState({top:0,left:0}),v=g[0],m=g[1],b=e.useRef(null),w=e.useRef(null),x=function(){i=setTimeout((function(){if(b.current&&w.current){var t=b.current.getBoundingClientRect(),e=w.current.getBoundingClientRect(),o=0,i=0;switch(l){case"top":o=t.top-e.height-8,i=t.left+(t.width-e.width)/2;break;case"right":o=t.top+(t.height-e.height)/2,i=t.right+8;break;case"bottom":o=t.bottom+8,i=t.left+(t.width-e.width)/2;break;case"left":o=t.top+(t.height-e.height)/2,i=t.left-e.width-8}m({top:o,left:i}),d(!0)}}),s)},j=function(){clearTimeout(i),d(!1)};e.useEffect((function(){return function(){return clearTimeout(i)}}),[]);var B=["tooltip","tooltip--".concat(l),p?"tooltip--visible":"",f].filter(Boolean).join(" ");return t.jsxs("div",{ref:b,className:"tooltip-trigger",onMouseEnter:x,onMouseLeave:j,onFocus:x,onBlur:j,children:[n,t.jsx("div",{ref:w,className:B,style:{top:"".concat(v.top,"px"),left:"".concat(v.left,"px")},role:"tooltip",children:r})]})};
//# sourceMappingURL=index.js.map