react-tooltip
Version:
react tooltip component
9 lines (8 loc) • 22.3 kB
JavaScript
/*
* React Tooltip
* {@link https://github.com/ReactTooltip/react-tooltip}
* @copyright ReactTooltip Team
* @license MIT
*/
import e,{useLayoutEffect as t,useEffect as o,createContext as r,useState as l,useCallback as n,useMemo as i,useContext as c,useRef as s,useImperativeHandle as a}from"react";import{arrow as u,computePosition as d,offset as p,flip as v,shift as m,autoUpdate as f}from"@floating-ui/dom";import y from"classnames";const h="react-tooltip-core-styles",w="react-tooltip-base-styles",b={core:!1,base:!1};function S({css:e,id:t=w,type:o="base",ref:r}){var l,n;if(!e||"undefined"==typeof document||b[o])return;if("core"===o&&"undefined"!=typeof process&&(null===(l=null===process||void 0===process?void 0:process.env)||void 0===l?void 0:l.REACT_TOOLTIP_DISABLE_CORE_STYLES))return;if("base"!==o&&"undefined"!=typeof process&&(null===(n=null===process||void 0===process?void 0:process.env)||void 0===n?void 0:n.REACT_TOOLTIP_DISABLE_BASE_STYLES))return;"core"===o&&(t=h),r||(r={});const{insertAt:i}=r;if(document.getElementById(t))return;const c=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.id=t,s.type="text/css","top"===i&&c.firstChild?c.insertBefore(s,c.firstChild):c.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e)),b[o]=!0}function g({type:e="base",id:t=w}={}){if(!b[e])return;"core"===e&&(t=h);const o=document.getElementById(t);"style"===(null==o?void 0:o.tagName)?null==o||o.remove():console.warn(`[react-tooltip] Failed to remove 'style' element with id '${t}'. Call \`injectStyle()\` first`),b[e]=!1}const E=async({elementReference:e=null,tooltipReference:t=null,tooltipArrowReference:o=null,place:r="top",offset:l=10,strategy:n="absolute",middlewares:i=[p(Number(l)),v({fallbackAxisSideDirection:"start"}),m({padding:5})],border:c,arrowSize:s=8})=>{if(!e)return{tooltipStyles:{},tooltipArrowStyles:{},place:r};if(null===t)return{tooltipStyles:{},tooltipArrowStyles:{},place:r};const a=i;return o?(a.push(u({element:o,padding:5})),d(e,t,{placement:r,strategy:n,middleware:a}).then((({x:e,y:t,placement:o,middlewareData:r})=>{var l,n;const i={left:`${e}px`,top:`${t}px`,border:c},{x:a,y:u}=null!==(l=r.arrow)&&void 0!==l?l:{x:0,y:0},d=null!==(n={top:"bottom",right:"left",bottom:"top",left:"right"}[o.split("-")[0]])&&void 0!==n?n:"bottom",p=c&&{borderBottom:c,borderRight:c};let v=0;if(c){const e=`${c}`.match(/(\d+)px/);v=(null==e?void 0:e[1])?Number(e[1]):1}return{tooltipStyles:i,tooltipArrowStyles:{left:null!=a?`${a}px`:"",top:null!=u?`${u}px`:"",right:"",bottom:"",...p,[d]:`-${s/2+v}px`},place:o}}))):d(e,t,{placement:"bottom",strategy:n,middleware:a}).then((({x:e,y:t,placement:o})=>({tooltipStyles:{left:`${e}px`,top:`${t}px`},tooltipArrowStyles:{},place:o})))},A=(e,t)=>!("CSS"in window&&"supports"in window.CSS)||window.CSS.supports(e,t),_=(e,t,o)=>{let r=null;const l=function(...l){const n=()=>{r=null,o||e.apply(this,l)};o&&!r&&(e.apply(this,l),r=setTimeout(n,t)),o||(r&&clearTimeout(r),r=setTimeout(n,t))};return l.cancel=()=>{r&&(clearTimeout(r),r=null)},l},O=e=>null!==e&&!Array.isArray(e)&&"object"==typeof e,k=(e,t)=>{if(e===t)return!0;if(Array.isArray(e)&&Array.isArray(t))return e.length===t.length&&e.every(((e,o)=>k(e,t[o])));if(Array.isArray(e)!==Array.isArray(t))return!1;if(!O(e)||!O(t))return e===t;const o=Object.keys(e),r=Object.keys(t);return o.length===r.length&&o.every((o=>k(e[o],t[o])))},T=e=>{if(!(e instanceof HTMLElement||e instanceof SVGElement))return!1;const t=getComputedStyle(e);return["overflow","overflow-x","overflow-y"].some((e=>{const o=t.getPropertyValue(e);return"auto"===o||"scroll"===o}))},L=e=>{if(!e)return null;let t=e.parentElement;for(;t;){if(T(t))return t;t=t.parentElement}return document.scrollingElement||document.documentElement},C="undefined"!=typeof window?t:o,R=e=>{e.current&&(clearTimeout(e.current),e.current=null)},x="DEFAULT_TOOLTIP_ID",N={anchorRefs:new Set,activeAnchor:{current:null},attach:()=>{},detach:()=>{},setActiveAnchor:()=>{}},$=r({getTooltipData:()=>N}),j=({children:t})=>{const[o,r]=l({[x]:new Set}),[c,s]=l({[x]:{current:null}}),a=(e,...t)=>{r((o=>{var r;const l=null!==(r=o[e])&&void 0!==r?r:new Set;return t.forEach((e=>l.add(e))),{...o,[e]:new Set(l)}}))},u=(e,...t)=>{r((o=>{const r=o[e];return r?(t.forEach((e=>r.delete(e))),{...o}):o}))},d=n(((e=x)=>{var t,r;return{anchorRefs:null!==(t=o[e])&&void 0!==t?t:new Set,activeAnchor:null!==(r=c[e])&&void 0!==r?r:{current:null},attach:(...t)=>a(e,...t),detach:(...t)=>u(e,...t),setActiveAnchor:t=>((e,t)=>{s((o=>{var r;return(null===(r=o[e])||void 0===r?void 0:r.current)===t.current?o:{...o,[e]:t}}))})(e,t)}}),[o,c,a,u]),p=i((()=>({getTooltipData:d})),[d]);return e.createElement($.Provider,{value:p},t)};function I(e=x){return c($).getTooltipData(e)}const z=({tooltipId:t,children:r,className:l,place:n,content:i,html:c,variant:a,offset:u,wrapper:d,events:p,positionStrategy:v,delayShow:m,delayHide:f})=>{const{attach:h,detach:w}=I(t),b=s(null);return o((()=>(h(b),()=>{w(b)})),[]),e.createElement("span",{ref:b,className:y("react-tooltip-wrapper",l),"data-tooltip-place":n,"data-tooltip-content":i,"data-tooltip-html":c,"data-tooltip-variant":a,"data-tooltip-offset":u,"data-tooltip-wrapper":d,"data-tooltip-events":p,"data-tooltip-position-strategy":v,"data-tooltip-delay-show":m,"data-tooltip-delay-hide":f},r)};var B={tooltip:"core-styles-module_tooltip__3vRRp",fixed:"core-styles-module_fixed__pcSol",arrow:"core-styles-module_arrow__cvMwQ",noArrow:"core-styles-module_noArrow__xock6",clickable:"core-styles-module_clickable__ZuTTB",show:"core-styles-module_show__Nt9eE",closing:"core-styles-module_closing__sGnxF"},D={tooltip:"styles-module_tooltip__mnnfp",arrow:"styles-module_arrow__K0L3T",dark:"styles-module_dark__xNqje",light:"styles-module_light__Z6W-X",success:"styles-module_success__A2AKt",warning:"styles-module_warning__SCK0X",error:"styles-module_error__JvumD",info:"styles-module_info__BWdHW"};const q=({forwardRef:t,id:r,className:i,classNameArrow:c,variant:u="dark",anchorId:d,anchorSelect:p,place:v="top",offset:m=10,events:h=["hover"],openOnClick:w=!1,positionStrategy:b="absolute",middlewares:S,wrapper:g,delayShow:A=0,delayHide:O=0,float:T=!1,hidden:x=!1,noArrow:N=!1,clickable:$=!1,closeOnEsc:j=!1,closeOnScroll:z=!1,closeOnResize:q=!1,openEvents:H,closeEvents:M,globalCloseEvents:W,imperativeModeOnly:P,style:V,position:F,afterShow:K,afterHide:U,disableTooltip:X,content:Y,contentWrapperRef:G,isOpen:Z,defaultIsOpen:J=!1,setIsOpen:Q,previousActiveAnchor:ee,activeAnchor:te,setActiveAnchor:oe,border:re,opacity:le,arrowColor:ne,arrowSize:ie=8,role:ce="tooltip"})=>{var se;const ae=s(null),ue=s(null),de=s(null),pe=s(null),ve=s(null),[me,fe]=l({tooltipStyles:{},tooltipArrowStyles:{},place:v}),[ye,he]=l(!1),[we,be]=l(!1),[Se,ge]=l(null),Ee=s(!1),Ae=s(null),{anchorRefs:_e,setActiveAnchor:Oe}=I(r),ke=s(!1),[Te,Le]=l([]),Ce=s(!1),Re=w||h.includes("click"),xe=Re||(null==H?void 0:H.click)||(null==H?void 0:H.dblclick)||(null==H?void 0:H.mousedown),Ne=H?{...H}:{mouseover:!0,focus:!0,mouseenter:!1,click:!1,dblclick:!1,mousedown:!1};!H&&Re&&Object.assign(Ne,{mouseenter:!1,focus:!1,mouseover:!1,click:!0});const $e=M?{...M}:{mouseout:!0,blur:!0,mouseleave:!1,click:!1,dblclick:!1,mouseup:!1};!M&&Re&&Object.assign($e,{mouseleave:!1,blur:!1,mouseout:!1});const je=W?{...W}:{escape:j||!1,scroll:z||!1,resize:q||!1,clickOutsideAnchor:xe||!1};P&&(Object.assign(Ne,{mouseover:!1,focus:!1,mouseenter:!1,click:!1,dblclick:!1,mousedown:!1}),Object.assign($e,{mouseout:!1,blur:!1,mouseleave:!1,click:!1,dblclick:!1,mouseup:!1}),Object.assign(je,{escape:!1,scroll:!1,resize:!1,clickOutsideAnchor:!1})),C((()=>(Ce.current=!0,()=>{Ce.current=!1})),[]);const Ie=e=>{Ce.current&&(e&&be(!0),setTimeout((()=>{Ce.current&&(null==Q||Q(e),void 0===Z&&he(e))}),10))};o((()=>{if(r){if(ye){t(ee);const o=e(te),l=[...new Set([...o,r])].filter(Boolean).join(" ");null==te||te.setAttribute("aria-describedby",l)}else t(te);return()=>{t(te),t(ee)}}function e(e){var t;return(null===(t=null==e?void 0:e.getAttribute("aria-describedby"))||void 0===t?void 0:t.split(" "))||[]}function t(t){const o=e(t).filter((e=>e!==r));o.length?null==t||t.setAttribute("aria-describedby",o.join(" ")):null==t||t.removeAttribute("aria-describedby")}}),[te,ye,r,ee]),o((()=>{if(void 0===Z)return()=>null;Z&&be(!0);const e=setTimeout((()=>{he(Z)}),10);return()=>{clearTimeout(e)}}),[Z]),o((()=>{if(ye!==Ee.current)if(R(ve),Ee.current=ye,ye)null==K||K();else{const e=(e=>{const t=e.match(/^([\d.]+)(ms|s)$/);if(!t)return 0;const[,o,r]=t;return Number(o)*("ms"===r?1:1e3)})(getComputedStyle(document.body).getPropertyValue("--rt-transition-show-delay"));ve.current=setTimeout((()=>{be(!1),ge(null),null==U||U()}),e+25)}}),[ye]);const ze=e=>{fe((t=>k(t,e)?t:e))},Be=(e=A)=>{R(de),we?Ie(!0):de.current=setTimeout((()=>{Ie(!0)}),e)},De=(e=O)=>{R(pe),pe.current=setTimeout((()=>{ke.current||Ie(!1)}),e)},qe=e=>{var t;if(!e)return;const o=null!==(t=e.currentTarget)&&void 0!==t?t:e.target;if(!(null==o?void 0:o.isConnected))return oe(null),void Oe({current:null});A?Be():Ie(!0),oe(o),Oe({current:o}),R(pe)},He=()=>{$?De(O||100):O?De():Ie(!1),R(de)},Me=({x:e,y:t})=>{var o;const r={getBoundingClientRect:()=>({x:e,y:t,width:0,height:0,top:t,left:e,right:e,bottom:t})};E({place:null!==(o=null==Se?void 0:Se.place)&&void 0!==o?o:v,offset:m,elementReference:r,tooltipReference:ae.current,tooltipArrowReference:ue.current,strategy:b,middlewares:S,border:re,arrowSize:ie}).then((e=>{ze(e)}))},We=e=>{if(!e)return;const t=e,o={x:t.clientX,y:t.clientY};Me(o),Ae.current=o},Pe=e=>{var t;if(!ye)return;const o=e.target;if(!o.isConnected)return;if(null===(t=ae.current)||void 0===t?void 0:t.contains(o))return;[document.querySelector(`[id='${d}']`),...Te].some((e=>null==e?void 0:e.contains(o)))||(Ie(!1),R(de))},Ve=_(qe,50,!0),Fe=_(He,50,!0),Ke=e=>{Fe.cancel(),Ve(e)},Ue=()=>{Ve.cancel(),Fe()},Xe=n((()=>{var e,t;const o=null!==(e=null==Se?void 0:Se.position)&&void 0!==e?e:F;o?Me(o):T?Ae.current&&Me(Ae.current):(null==te?void 0:te.isConnected)&&E({place:null!==(t=null==Se?void 0:Se.place)&&void 0!==t?t:v,offset:m,elementReference:te,tooltipReference:ae.current,tooltipArrowReference:ue.current,strategy:b,middlewares:S,border:re,arrowSize:ie}).then((e=>{Ce.current&&ze(e)}))}),[ye,te,Y,V,v,null==Se?void 0:Se.place,m,b,F,null==Se?void 0:Se.position,T,ie]);o((()=>{var e,t;const o=new Set(_e);Te.forEach((e=>{(null==X?void 0:X(e))||o.add({current:e})}));const r=document.querySelector(`[id='${d}']`);r&&!(null==X?void 0:X(r))&&o.add({current:r});const l=()=>{Ie(!1)},n=L(te),i=L(ae.current);je.scroll&&(window.addEventListener("scroll",l),null==n||n.addEventListener("scroll",l),null==i||i.addEventListener("scroll",l));let c=null;je.resize?window.addEventListener("resize",l):te&&ae.current&&(c=f(te,ae.current,Xe,{ancestorResize:!0,elementResize:!0,layoutShift:!0}));const s=e=>{"Escape"===e.key&&Ie(!1)};je.escape&&window.addEventListener("keydown",s),je.clickOutsideAnchor&&window.addEventListener("click",Pe);const a=[],u=e=>Boolean((null==e?void 0:e.target)&&(null==te?void 0:te.contains(e.target))),p=e=>{ye&&u(e)||qe(e)},v=e=>{ye&&u(e)&&He()},m=["mouseover","mouseout","mouseenter","mouseleave","focus","blur"],y=["click","dblclick","mousedown","mouseup"];Object.entries(Ne).forEach((([e,t])=>{t&&(m.includes(e)?a.push({event:e,listener:Ke}):y.includes(e)&&a.push({event:e,listener:p}))})),Object.entries($e).forEach((([e,t])=>{t&&(m.includes(e)?a.push({event:e,listener:Ue}):y.includes(e)&&a.push({event:e,listener:v}))})),T&&a.push({event:"pointermove",listener:We});const h=()=>{ke.current=!0},w=()=>{ke.current=!1,He()},b=$&&($e.mouseout||$e.mouseleave);return b&&(null===(e=ae.current)||void 0===e||e.addEventListener("mouseover",h),null===(t=ae.current)||void 0===t||t.addEventListener("mouseout",w)),a.forEach((({event:e,listener:t})=>{o.forEach((o=>{var r;null===(r=o.current)||void 0===r||r.addEventListener(e,t)}))})),()=>{var e,t;je.scroll&&(window.removeEventListener("scroll",l),null==n||n.removeEventListener("scroll",l),null==i||i.removeEventListener("scroll",l)),je.resize?window.removeEventListener("resize",l):null==c||c(),je.clickOutsideAnchor&&window.removeEventListener("click",Pe),je.escape&&window.removeEventListener("keydown",s),b&&(null===(e=ae.current)||void 0===e||e.removeEventListener("mouseover",h),null===(t=ae.current)||void 0===t||t.removeEventListener("mouseout",w)),a.forEach((({event:e,listener:t})=>{o.forEach((o=>{var r;null===(r=o.current)||void 0===r||r.removeEventListener(e,t)}))}))}}),[te,Xe,we,_e,Te,H,M,W,Re,A,O]),o((()=>{var e,t;let o=null!==(t=null!==(e=null==Se?void 0:Se.anchorSelect)&&void 0!==e?e:p)&&void 0!==t?t:"";!o&&r&&(o=`[data-tooltip-id='${r.replace(/'/g,"\\'")}']`);const l=new MutationObserver((e=>{const t=[],l=[];e.forEach((e=>{if("attributes"===e.type&&"data-tooltip-id"===e.attributeName){e.target.getAttribute("data-tooltip-id")===r?t.push(e.target):e.oldValue===r&&l.push(e.target)}if("childList"===e.type){if(te){const t=[...e.removedNodes].filter((e=>1===e.nodeType));if(o)try{l.push(...t.filter((e=>e.matches(o)))),l.push(...t.flatMap((e=>[...e.querySelectorAll(o)])))}catch(e){}t.some((e=>{var t;return!!(null===(t=null==e?void 0:e.contains)||void 0===t?void 0:t.call(e,te))&&(be(!1),Ie(!1),oe(null),R(de),R(pe),!0)}))}if(o)try{const r=[...e.addedNodes].filter((e=>1===e.nodeType));t.push(...r.filter((e=>e.matches(o)))),t.push(...r.flatMap((e=>[...e.querySelectorAll(o)])))}catch(e){}}})),(t.length||l.length)&&Le((e=>[...e.filter((e=>!l.includes(e))),...t]))}));return l.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-tooltip-id"],attributeOldValue:!0}),()=>{l.disconnect()}}),[r,p,null==Se?void 0:Se.anchorSelect,te]),o((()=>{Xe()}),[Xe]),o((()=>{if(!(null==G?void 0:G.current))return()=>null;const e=new ResizeObserver((()=>{setTimeout((()=>Xe()))}));return e.observe(G.current),()=>{e.disconnect()}}),[Y,null==G?void 0:G.current]),o((()=>{var e;const t=document.querySelector(`[id='${d}']`),o=[...Te,t];te&&o.includes(te)||oe(null!==(e=Te[0])&&void 0!==e?e:t)}),[d,Te,te]),o((()=>(J&&Ie(!0),()=>{R(de),R(pe)})),[]),o((()=>{var e;let t=null!==(e=null==Se?void 0:Se.anchorSelect)&&void 0!==e?e:p;if(!t&&r&&(t=`[data-tooltip-id='${r.replace(/'/g,"\\'")}']`),t)try{const e=Array.from(document.querySelectorAll(t));Le(e)}catch(e){Le([])}}),[r,p,null==Se?void 0:Se.anchorSelect]),o((()=>{de.current&&(R(de),Be(A))}),[A]);const Ye=null!==(se=null==Se?void 0:Se.content)&&void 0!==se?se:Y,Ge=ye&&Object.keys(me.tooltipStyles).length>0;return a(t,(()=>({open:e=>{if(null==e?void 0:e.anchorSelect)try{document.querySelector(e.anchorSelect)}catch(t){return void console.warn(`[react-tooltip] "${e.anchorSelect}" is not a valid CSS selector`)}ge(null!=e?e:null),(null==e?void 0:e.delay)?Be(e.delay):Ie(!0)},close:e=>{(null==e?void 0:e.delay)?De(e.delay):Ie(!1)},activeAnchor:te,place:me.place,isOpen:Boolean(we&&!x&&Ye&&Ge)}))),we&&!x&&Ye?e.createElement(g,{id:r,role:ce,className:y("react-tooltip",B.tooltip,D.tooltip,D[u],i,`react-tooltip__place-${me.place}`,B[Ge?"show":"closing"],Ge?"react-tooltip__show":"react-tooltip__closing","fixed"===b&&B.fixed,$&&B.clickable),onTransitionEnd:e=>{R(ve),ye||"opacity"!==e.propertyName||(be(!1),ge(null),null==U||U())},style:{...V,...me.tooltipStyles,opacity:void 0!==le&&Ge?le:void 0},ref:ae},Ye,e.createElement(g,{className:y("react-tooltip-arrow",B.arrow,D.arrow,c,N&&B.noArrow),style:{...me.tooltipArrowStyles,background:ne?`linear-gradient(to right bottom, transparent 50%, ${ne} 50%)`:void 0,"--rt-arrow-size":`${ie}px`},ref:ue})):null},H=({content:t})=>e.createElement("span",{dangerouslySetInnerHTML:{__html:t}}),M=e.forwardRef((({id:t,anchorId:r,anchorSelect:n,content:i,html:c,render:a,className:u,classNameArrow:d,variant:p="dark",place:v="top",offset:m=10,wrapper:f="div",children:h=null,events:w=["hover"],openOnClick:b=!1,positionStrategy:S="absolute",middlewares:g,delayShow:E=0,delayHide:_=0,float:O=!1,hidden:k=!1,noArrow:T=!1,clickable:L=!1,closeOnEsc:C=!1,closeOnScroll:R=!1,closeOnResize:x=!1,openEvents:N,closeEvents:$,globalCloseEvents:j,imperativeModeOnly:z=!1,style:B,position:D,isOpen:M,defaultIsOpen:W=!1,disableStyleInjection:P=!1,border:V,opacity:F,arrowColor:K,arrowSize:U,setIsOpen:X,afterShow:Y,afterHide:G,disableTooltip:Z,role:J="tooltip"},Q)=>{const[ee,te]=l(i),[oe,re]=l(c),[le,ne]=l(v),[ie,ce]=l(p),[se,ae]=l(m),[ue,de]=l(E),[pe,ve]=l(_),[me,fe]=l(O),[ye,he]=l(k),[we,be]=l(f),[Se,ge]=l(w),[Ee,Ae]=l(S),[_e,Oe]=l(null),[ke,Te]=l(null),Le=s(null),Ce=s(P),{anchorRefs:Re,activeAnchor:xe}=I(t),Ne=e=>null==e?void 0:e.getAttributeNames().reduce(((t,o)=>{var r;if(o.startsWith("data-tooltip-")){t[o.replace(/^data-tooltip-/,"")]=null!==(r=null==e?void 0:e.getAttribute(o))&&void 0!==r?r:null}return t}),{}),$e=e=>{const t={place:e=>{var t;ne(null!==(t=e)&&void 0!==t?t:v)},content:e=>{te(null!=e?e:i)},html:e=>{re(null!=e?e:c)},variant:e=>{var t;ce(null!==(t=e)&&void 0!==t?t:p)},offset:e=>{ae(null===e?m:Number(e))},wrapper:e=>{var t;be(null!==(t=e)&&void 0!==t?t:f)},events:e=>{const t=null==e?void 0:e.split(" ");ge(null!=t?t:w)},"position-strategy":e=>{var t;Ae(null!==(t=e)&&void 0!==t?t:S)},"delay-show":e=>{de(null===e?E:Number(e))},"delay-hide":e=>{ve(null===e?_:Number(e))},float:e=>{fe(null===e?O:"true"===e)},hidden:e=>{he(null===e?k:"true"===e)},"class-name":e=>{Oe(e)}};Object.values(t).forEach((e=>e(null))),Object.entries(e).forEach((([e,o])=>{var r;null===(r=t[e])||void 0===r||r.call(t,o)}))};o((()=>{te(i)}),[i]),o((()=>{re(c)}),[c]),o((()=>{ne(v)}),[v]),o((()=>{ce(p)}),[p]),o((()=>{ae(m)}),[m]),o((()=>{de(E)}),[E]),o((()=>{ve(_)}),[_]),o((()=>{fe(O)}),[O]),o((()=>{he(k)}),[k]),o((()=>{Ae(S)}),[S]),o((()=>{Ce.current!==P&&console.warn("[react-tooltip] Do not change `disableStyleInjection` dynamically.")}),[P]),o((()=>{"undefined"!=typeof window&&window.dispatchEvent(new CustomEvent("react-tooltip-inject-styles",{detail:{disableCore:"core"===P,disableBase:P}}))}),[]),o((()=>{var e;const o=new Set(Re);let l=n;if(!l&&t&&(l=`[data-tooltip-id='${t.replace(/'/g,"\\'")}']`),l)try{document.querySelectorAll(l).forEach((e=>{o.add({current:e})}))}catch(e){console.warn(`[react-tooltip] "${l}" is not a valid CSS selector`)}const i=document.querySelector(`[id='${r}']`);if(i&&o.add({current:i}),!o.size)return()=>null;const c=null!==(e=null!=ke?ke:i)&&void 0!==e?e:xe.current,s=new MutationObserver((e=>{e.forEach((e=>{var t;if(!c||"attributes"!==e.type||!(null===(t=e.attributeName)||void 0===t?void 0:t.startsWith("data-tooltip-")))return;const o=Ne(c);$e(o)}))})),a={attributes:!0,childList:!1,subtree:!1};if(c){const e=Ne(c);$e(e),s.observe(c,a)}return()=>{s.disconnect()}}),[Re,xe,ke,r,n]),o((()=>{(null==B?void 0:B.border)&&console.warn("[react-tooltip] Do not set `style.border`. Use `border` prop instead."),V&&!A("border",`${V}`)&&console.warn(`[react-tooltip] "${V}" is not a valid \`border\`.`),(null==B?void 0:B.opacity)&&console.warn("[react-tooltip] Do not set `style.opacity`. Use `opacity` prop instead."),F&&!A("opacity",`${F}`)&&console.warn(`[react-tooltip] "${F}" is not a valid \`opacity\`.`)}),[]);let je=h;const Ie=s(null);if(a){const t=a({content:(null==ke?void 0:ke.getAttribute("data-tooltip-content"))||ee||null,activeAnchor:ke});je=t?e.createElement("div",{ref:Ie,className:"react-tooltip-content-wrapper"},t):null}else ee&&(je=ee);oe&&(je=e.createElement(H,{content:oe}));const ze={forwardRef:Q,id:t,anchorId:r,anchorSelect:n,className:y(u,_e),classNameArrow:d,content:je,contentWrapperRef:Ie,place:le,variant:ie,offset:se,wrapper:we,events:Se,openOnClick:b,positionStrategy:Ee,middlewares:g,delayShow:ue,delayHide:pe,float:me,hidden:ye,noArrow:T,clickable:L,closeOnEsc:C,closeOnScroll:R,closeOnResize:x,openEvents:N,closeEvents:$,globalCloseEvents:j,imperativeModeOnly:z,style:B,position:D,isOpen:M,defaultIsOpen:W,border:V,opacity:F,arrowColor:K,arrowSize:U,setIsOpen:X,afterShow:Y,afterHide:G,disableTooltip:Z,activeAnchor:ke,previousActiveAnchor:Le.current,setActiveAnchor:e=>{Te((t=>((null==e?void 0:e.isSameNode(t))||(Le.current=t),e)))},role:J};return e.createElement(q,{...ze})}));"undefined"!=typeof window&&window.addEventListener("react-tooltip-inject-styles",(e=>{e.detail.disableCore||S({css:`:root{--rt-color-white:#fff;--rt-color-dark:#222;--rt-color-success:#8dc572;--rt-color-error:#be6464;--rt-color-warning:#f0ad4e;--rt-color-info:#337ab7;--rt-opacity:0.9;--rt-transition-show-delay:0.15s;--rt-transition-closing-delay:0.15s;--rt-arrow-size:8px}.core-styles-module_tooltip__3vRRp{position:absolute;top:0;left:0;pointer-events:none;opacity:0;will-change:opacity}.core-styles-module_fixed__pcSol{position:fixed}.core-styles-module_arrow__cvMwQ{position:absolute;background:inherit;z-index:-1}.core-styles-module_noArrow__xock6{display:none}.core-styles-module_clickable__ZuTTB{pointer-events:auto}.core-styles-module_show__Nt9eE{opacity:var(--rt-opacity);transition:opacity var(--rt-transition-show-delay)ease-out}.core-styles-module_closing__sGnxF{opacity:0;transition:opacity var(--rt-transition-closing-delay)ease-in}`,type:"core"}),e.detail.disableBase||S({css:`
.styles-module_tooltip__mnnfp{padding:8px 16px;border-radius:3px;font-size:90%;width:max-content}.styles-module_arrow__K0L3T{width:var(--rt-arrow-size);height:var(--rt-arrow-size)}[class*='react-tooltip__place-top']>.styles-module_arrow__K0L3T{transform:rotate(45deg)}[class*='react-tooltip__place-right']>.styles-module_arrow__K0L3T{transform:rotate(135deg)}[class*='react-tooltip__place-bottom']>.styles-module_arrow__K0L3T{transform:rotate(225deg)}[class*='react-tooltip__place-left']>.styles-module_arrow__K0L3T{transform:rotate(315deg)}.styles-module_dark__xNqje{background:var(--rt-color-dark);color:var(--rt-color-white)}.styles-module_light__Z6W-X{background-color:var(--rt-color-white);color:var(--rt-color-dark)}.styles-module_success__A2AKt{background-color:var(--rt-color-success);color:var(--rt-color-white)}.styles-module_warning__SCK0X{background-color:var(--rt-color-warning);color:var(--rt-color-white)}.styles-module_error__JvumD{background-color:var(--rt-color-error);color:var(--rt-color-white)}.styles-module_info__BWdHW{background-color:var(--rt-color-info);color:var(--rt-color-white)}`,type:"base"})}));export{M as Tooltip,j as TooltipProvider,z as TooltipWrapper,g as removeStyle};