@styleless-ui/react/esm/Tooltip/Tooltip.js

Completely unstyled, headless and accessible React UI components.

var e=this&&this.__assign||function(){return e=Object.assign||function(e){for(var t,n=1,o=arguments.length;n<o;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},e.apply(this,arguments)},t=this&&this.__rest||function(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++)t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(n[o[r]]=e[o[r]])}return n};import{jsx as n}from"react/jsx-runtime";import*as o from"react";import r from"../Popper";import{SystemKeys as l}from"../internals";import{componentWithForwardedRef as i,contains as u,isHTMLElement as c,useControlledProp as a,useDeterministicId as p,useEventCallback as s,useEventListener as f,useForkedRefs as d}from"../utils";var m=function(e){return"string"==typeof e?"undefined"!=typeof document?document.querySelector(e):null:"current"in e?e.current:e},h=i((function(i,h){var y=i.children,v=i.className,g=i.anchorElement,O=i.defaultOpen,w=i.onOutsideClick,b=i.id,E=i.open,T=i.keepMounted,k=void 0!==T&&T,x=i.autoPlacement,j=void 0!==x&&x,P=i.placement,S=void 0===P?"top":P,M=i.behavior,C=void 0===M?"full-controlled":M,R=t(i,["children","className","anchorElement","defaultOpen","onOutsideClick","id","open","keepMounted","autoPlacement","placement","behavior"]);if(!g)throw new Error(["[StylelessUI][Tooltip]: Invalid `anchorElement` property.","The `anchorElement` property must be either a `valid query selector (string)`, `HTMLElement`, `RefObject<HTMLElement>`, or in shape of `{ getBoundingClientRect(): ClientRect }`"].join("\n"));if("full-controlled"!==C&&void 0!==E)throw new Error('[StylelessUI][Tooltip]: You are trying to control the `open` property while the `behavior` isn\'t `"full-controlled".`');var _=p(b,"styleless-ui__tooltip"),I=o.useRef(null),H=d(h,I),L=a(E,O,!1),N=L[0],q=L[1],B=o.useState((function(){return m(g)})),U=B[0],Y=B[1],A=o.useState({x:0,y:0}),X=A[0],z=A[1],D=o.useRef(null),F=s((function(e){e.target&&U&&U!==e.target&&I.current&&I.current!==e.target&&U instanceof HTMLElement&&(u(U,e.target)||u(I.current,e.target)||null==w||w(e))}));if(o.useEffect((function(){Y(m(g))}),[g]),"undefined"!=typeof document){var G=o.useMemo((function(){return c(U)?U:null}),[U]);f({target:G,eventType:"click",handler:s((function(){q(!N)}))},c(U)&&"open-on-click"===C),f({target:G,eventType:"mouseenter",handler:s((function(){q(!0)}))},c(U)&&["open-on-hover","follow-mouse"].includes(C)),f({target:G,eventType:"mouseleave",handler:s((function(){q(!1)}))},c(U)&&["open-on-hover","follow-mouse"].includes(C)),f({target:G,eventType:"mousemove",handler:s((function(e){var t;z({x:e.clientX,y:e.clientY}),null===(t=D.current)||void 0===t||t.recompute()}))},c(U)&&"follow-mouse"===C),f({target:document,eventType:"click",handler:F,options:{capture:!0}},N&&!!w),f({target:document,eventType:"keyup",handler:s((function(e){e.key===l.ESCAPE&&q(!1)}))},N&&"open-on-click"===C)}return n(r,e({},R,{id:_,role:"tooltip",open:N,ref:H,side:S,actions:D,className:v,keepMounted:k,autoPlacement:"follow-mouse"!==C&&j,offset:"follow-mouse"===C?32:void 0,anchorElement:"follow-mouse"===C?{getBoundingClientRect:function(){return{width:0,height:0,x:X.x,y:X.y,top:X.y,left:X.x,right:X.x,bottom:X.y}}}:g},{children:y}))}));export default h;