stofli-ui/dist/components/tooltip/index.js

Biblioteca moderna de componentes UI para React con Tailwind CSS y Framer Motion

'use client';
"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("framer-motion"),n=require("clsx"),a=require("tailwind-merge"),o=function(){return o=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var a in t=arguments[r])Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a]);return e},o.apply(this,arguments)};function i(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return a.twMerge(n.clsx(e))}"function"==typeof SuppressedError&&SuppressedError;module.exports=function(n){var a=n.children,u=n.content,s=n.position,d=void 0===s?"top":s,c=n.variant,f=void 0===c?"default":c,l=n.delay,b=void 0===l?300:l,p=n.maxWidth,h=void 0===p?"200px":p,m=n.showArrow,g=void 0!==m&&m,w=n.className,v=void 0===w?"":w,x=n.tooltipClassName,y=void 0===x?"":x,k=n.contentClassName,E=void 0===k?"":k,C=n.arrowClassName,j=void 0===C?"":C,z=n.radius,N=void 0===z?"md":z,S=n.id,q=t.useState(!1),L=q[0],M=q[1],R=t.useRef(null),O=t.useRef(null),T=t.useRef(null),A=t.useState({top:0,left:0}),B=A[0],W=A[1],D=t.useState(!1),F=D[0],P=D[1],H=t.useState(!1),I=H[0],K=H[1],U=t.useState(!1),V=U[0],G=U[1],J=t.useId(),Q=S||"tooltip-".concat(J.replace(/:/g,"")),X=t.useCallback((function(){if(R.current&&O.current){var e=R.current.getBoundingClientRect(),t=O.current.getBoundingClientRect(),r=g?8:4,n=0,a=0;switch(d){case"top":a=e.left+e.width/2-t.width/2,n=e.top-t.height-r;break;case"right":a=e.right+r,n=e.top+e.height/2-t.height/2;break;case"bottom":a=e.left+e.width/2-t.width/2,n=e.bottom+r;break;case"left":a=e.left-t.width-r,n=e.top+e.height/2-t.height/2}var o=window.innerWidth,i=window.innerHeight;a<10&&(a=10),a+t.width>o-10&&(a=o-t.width-10),n<10&&(n=10),n+t.height>i-10&&(n=i-t.height-10),W({top:n,left:a})}}),[d,g]),Y=t.useCallback((function(){T.current&&clearTimeout(T.current),T.current=setTimeout((function(){M(!0)}),b)}),[b]),Z=t.useCallback((function(){T.current&&clearTimeout(T.current),M(!1)}),[]);t.useEffect((function(){F||I&&!V?Y():Z()}),[F,I,V,Y,Z]);t.useEffect((function(){var e=function(){L&&X()},t=function(){L&&X()};return L&&(window.addEventListener("scroll",e,!0),window.addEventListener("resize",t)),function(){window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",t)}}),[L,X]),t.useEffect((function(){L&&requestAnimationFrame((function(){return X()}))}),[L,X]);var $=t.Children.map(a,(function(e){return t.isValidElement(e)?t.cloneElement(e,o({"aria-describedby":L?Q:void 0},e.props)):e}));return e.jsxs("div",{ref:R,className:i("inline-block",v),onMouseEnter:function(){return P(!0)},onMouseLeave:function(){return P(!1)},onFocus:function(){return K(!0)},onBlur:function(){K(!1),G(!1)},onMouseDown:function(){return G(!0)},onMouseUp:function(){setTimeout((function(){return G(!1)}),300)},onKeyDown:function(e){"Escape"===e.key&&L&&Z()},children:[$,e.jsx(r.AnimatePresence,{children:L&&e.jsx(r.motion.div,{id:Q,ref:O,role:"tooltip",className:i("fixed z-50 px-3 py-2 text-sm shadow-lg pointer-events-none",{none:"rounded-none",sm:"rounded-[0.25rem]",md:"rounded-[0.375rem]",full:"rounded-full"}[N],{default:"bg-zinc-800 text-neutral-100 dark:bg-zinc-700",primary:"bg-blue-500 text-white dark:bg-blue-600",secondary:"bg-purple-500 text-white dark:bg-purple-600",success:"bg-green-500 text-white dark:bg-green-600",warning:"bg-amber-500 text-white dark:bg-amber-600",danger:"bg-red-500 text-white dark:bg-red-600"}[f],g&&{default:"after:border-zinc-800 dark:after:border-zinc-700",primary:"after:border-blue-500 dark:after:border-blue-600",secondary:"after:border-purple-500 dark:after:border-purple-600",success:"after:border-green-500 dark:after:border-green-600",warning:"after:border-amber-500 dark:after:border-amber-600",danger:"after:border-red-500 dark:after:border-red-600"}[f],g&&"\n                after:absolute \n                after:w-2 after:h-2 \n                after:bg-inherit \n                after:border-[1px]\n                ".concat(function(){switch(d){case"top":return"after:bottom-[-4px] after:left-1/2 after:transform after:-translate-x-1/2 after:rotate-45 after:border-b after:border-r";case"right":return"after:left-[-4px] after:top-1/2 after:transform after:-translate-y-1/2 after:-rotate-45 after:border-l after:border-b";case"bottom":return"after:top-[-4px] after:left-1/2 after:transform after:-translate-x-1/2 after:-rotate-135 after:border-t after:border-l";case"left":return"after:right-[-4px] after:top-1/2 after:transform after:-translate-y-1/2 after:rotate-45 after:border-t after:border-r";default:return""}}(),"\n                ").concat(j,"\n              "),y),style:{left:B.left,top:B.top,maxWidth:h},initial:"hidden",animate:"visible",exit:"exit",variants:{hidden:function(e){switch(e){case"top":default:return{opacity:0,y:-10};case"right":return{opacity:0,x:10};case"bottom":return{opacity:0,y:10};case"left":return{opacity:0,x:-10}}},visible:{opacity:1,x:0,y:0,transition:{duration:.2,ease:"easeOut"}},exit:function(e){switch(e){case"top":default:return{opacity:0,y:-5,transition:{duration:.1}};case"right":return{opacity:0,x:5,transition:{duration:.1}};case"bottom":return{opacity:0,y:5,transition:{duration:.1}};case"left":return{opacity:0,x:-5,transition:{duration:.1}}}}},custom:d,children:e.jsx("div",{className:i("",E),children:u})})})]})};
//# sourceMappingURL=index.js.map