UNPKG

stofli-ui

Version:

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

4 lines (3 loc) 5.3 kB
'use client'; import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useState as n,useRef as o,useId as a,useCallback as i,useEffect as d}from"react";import{AnimatePresence as f,motion as u}from"framer-motion";import{clsx as c}from"clsx";import{twMerge as s}from"tailwind-merge";var l=function(){return l=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},l.apply(this,arguments)};function p(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return s(c(e))}"function"==typeof SuppressedError&&SuppressedError;var b=function(c){var s=c.children,b=c.content,m=c.position,h=void 0===m?"top":m,g=c.variant,w=void 0===g?"default":g,v=c.delay,x=void 0===v?300:v,y=c.maxWidth,k=void 0===y?"200px":y,E=c.showArrow,z=void 0!==E&&E,N=c.className,C=void 0===N?"":N,L=c.tooltipClassName,M=void 0===L?"":L,O=c.contentClassName,T=void 0===O?"":O,j=c.arrowClassName,B=void 0===j?"":j,W=c.radius,A=void 0===W?"md":W,D=c.id,F=n(!1),R=F[0],S=F[1],q=o(null),H=o(null),K=o(null),P=n({top:0,left:0}),U=P[0],V=P[1],G=n(!1),I=G[0],J=G[1],Q=n(!1),X=Q[0],Y=Q[1],Z=n(!1),$=Z[0],_=Z[1],ee=a(),te=D||"tooltip-".concat(ee.replace(/:/g,"")),re=i((function(){if(q.current&&H.current){var e=q.current.getBoundingClientRect(),t=H.current.getBoundingClientRect(),r=z?8:4,n=0,o=0;switch(h){case"top":o=e.left+e.width/2-t.width/2,n=e.top-t.height-r;break;case"right":o=e.right+r,n=e.top+e.height/2-t.height/2;break;case"bottom":o=e.left+e.width/2-t.width/2,n=e.bottom+r;break;case"left":o=e.left-t.width-r,n=e.top+e.height/2-t.height/2}var a=window.innerWidth,i=window.innerHeight;o<10&&(o=10),o+t.width>a-10&&(o=a-t.width-10),n<10&&(n=10),n+t.height>i-10&&(n=i-t.height-10),V({top:n,left:o})}}),[h,z]),ne=i((function(){K.current&&clearTimeout(K.current),K.current=setTimeout((function(){S(!0)}),x)}),[x]),oe=i((function(){K.current&&clearTimeout(K.current),S(!1)}),[]);d((function(){I||X&&!$?ne():oe()}),[I,X,$,ne,oe]);d((function(){var e=function(){R&&re()},t=function(){R&&re()};return R&&(window.addEventListener("scroll",e,!0),window.addEventListener("resize",t)),function(){window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",t)}}),[R,re]),d((function(){R&&requestAnimationFrame((function(){return re()}))}),[R,re]);var ae=r.Children.map(s,(function(e){return r.isValidElement(e)?r.cloneElement(e,l({"aria-describedby":R?te:void 0},e.props)):e}));return e("div",{ref:q,className:p("inline-block",C),onMouseEnter:function(){return J(!0)},onMouseLeave:function(){return J(!1)},onFocus:function(){return Y(!0)},onBlur:function(){Y(!1),_(!1)},onMouseDown:function(){return _(!0)},onMouseUp:function(){setTimeout((function(){return _(!1)}),300)},onKeyDown:function(e){"Escape"===e.key&&R&&oe()},children:[ae,t(f,{children:R&&t(u.div,{id:te,ref:H,role:"tooltip",className:p("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"}[A],{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"}[w],z&&{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"}[w],z&&"\n after:absolute \n after:w-2 after:h-2 \n after:bg-inherit \n after:border-[1px]\n ".concat(function(){switch(h){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(B,"\n "),M),style:{left:U.left,top:U.top,maxWidth:k},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:h,children:t("div",{className:p("",T),children:b})})})]})};export{b as default}; //# sourceMappingURL=index.esm.js.map