tippy.js/dist/tippy-headless.umd.min.js

Highly customizable tooltip and popover library

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@popperjs/core")):"function"==typeof define&&define.amd?define(["exports","@popperjs/core"],t):t((e=e||self).tippy={},e.Popper)}(this,(function(e,t){"use strict";function n(e,t,n){if(Array.isArray(e)){var r=e[t];return null==r?Array.isArray(n)?n[t]:n:r}return e}function r(e,t){var n={}.toString.call(e);return 0===n.indexOf("[object")&&n.indexOf(t+"]")>-1}function i(e,t){return 0===t?e:function(r){clearTimeout(n),n=setTimeout((function(){e(r)}),t)};var n}function o(e,t){var n=Object.assign({},e);return t.forEach((function(e){delete n[e]})),n}function a(e){return[].concat(e)}function s(e,t){-1===e.indexOf(t)&&e.push(t)}function u(e,t){return e.filter((function(e){return e.name===t})).reduce((function(e,t){return Object.assign({},e,{},t,{options:Object.assign({},e.options,{},t.options)})}),{})}function c(e){return e.split("-")[0]}function p(e){return[].slice.call(e)}var f=Object.assign({appendTo:function(){return document.body},aria:"describedby",content:"",delay:0,duration:[300,250],getReferenceClientRect:null,hideOnClick:!0,ignoreAttributes:!1,interactive:!1,interactiveBorder:2,interactiveDebounce:0,moveTransition:"",offset:[0,10],onAfterUpdate:function(){},onBeforeUpdate:function(){},onCreate:function(){},onDestroy:function(){},onHidden:function(){},onHide:function(){},onMount:function(){},onShow:function(){},onShown:function(){},onTrigger:function(){},onUntrigger:function(){},placement:"top",plugins:[],popperOptions:{},render:null,showOnCreate:!1,touch:!0,trigger:"mouseenter focus",triggerTarget:null},{animateFill:!1,followCursor:!1,inlinePositioning:!1,sticky:!1},{},{allowHTML:!1,animation:"fade",arrow:!0,content:"",inertia:!1,maxWidth:350,role:"tooltip",theme:"",zIndex:9999}),l=Object.keys(f);function d(e){var t=(e.plugins||[]).reduce((function(t,n){var r=n.name,i=n.defaultValue;return r&&(t[r]=void 0!==e[r]?e[r]:i),t}),{});return Object.assign({},e,{},t)}function v(e,t){var n=Object.assign({},t,{},t.ignoreAttributes?{}:function(e,t){return(t?Object.keys(d(Object.assign({},f,{plugins:t}))):l).reduce((function(t,n){var r=(e.getAttribute("data-tippy-"+n)||"").trim();if(!r)return t;if("content"===n)t[n]=r;else try{t[n]=JSON.parse(r)}catch(e){t[n]=r}return t}),{})}(e,t.plugins));return n.interactive&&(n.aria=null),n}var g="undefined"!=typeof window&&"undefined"!=typeof document,m=g?navigator.userAgent:"",h=/MSIE |Trident\//.test(m),b=g&&/iPhone|iPad|iPod/.test(navigator.platform),y={passive:!0};function w(){return document.createElement("div")}function T(e){return r(e,"Element")}function E(e){return r(e,"MouseEvent")}function O(e){return!(!e||!e._tippy||e._tippy.reference!==e)}function A(e){return T(e)?[e]:function(e){return r(e,"NodeList")}(e)?p(e):Array.isArray(e)?e:p(document.querySelectorAll(e))}function C(e,t){e.forEach((function(e){e&&(e.style.transitionDuration=t+"ms")}))}function x(e,t){e.forEach((function(e){e&&e.setAttribute("data-state",t)}))}function D(e,t){for(;e;){if(t(e))return e;e=e.parentElement}return null}function L(e){var t=a(e)[0];return t&&t.ownerDocument||document}function P(e,t,n){var r=t+"EventListener";["transitionend","webkitTransitionEnd"].forEach((function(t){e[r](t,n)}))}var k={isTouch:!1},V=0;function j(){k.isTouch||(k.isTouch=!0,window.performance&&document.addEventListener("mousemove",R))}function R(){var e=performance.now();e-V<20&&(k.isTouch=!1,document.removeEventListener("mousemove",R)),V=e}function M(){var e=document.activeElement;if(O(e)){var t=e._tippy;e.blur&&!t.state.isVisible&&e.blur()}}function S(e){var t=e.firstElementChild,n=p(t.children);return{box:t,content:n.find((function(e){return e.classList.contains("tippy-content")})),arrow:n.find((function(e){return e.classList.contains("tippy-arrow")||e.classList.contains("tippy-svg-arrow")}))||null,backdrop:n.find((function(e){return e.classList.contains("tippy-backdrop")}))||null}}function I(e){return e.$$tippy}var B=1,H=[],N=[];function _(e,r){var o,l,g,m,T,O,A,V,j=v(e,Object.assign({},f,{},d(r))),R=!1,M=!1,_=!1,F=[],U=i(he,j.interactiveDebounce),q=L(j.triggerTarget||e),X=B++,Y=(V=j.plugins).filter((function(e,t){return V.indexOf(e)===t})),z={id:X,reference:e,popper:w(),popperInstance:null,props:j,state:{currentPlacement:null,isEnabled:!0,isVisible:!1,isDestroyed:!1,isMounted:!1,isShown:!1},plugins:Y,clearDelayTimeouts:function(){clearTimeout(o),clearTimeout(l),cancelAnimationFrame(g)},setProps:function(t){if(z.state.isDestroyed)return;oe("onBeforeUpdate",[z,t]),ge();var n=z.props,r=v(e,Object.assign({},z.props,{},t,{ignoreAttributes:!0}));z.props=r,ve(),n.interactiveDebounce!==r.interactiveDebounce&&(ue(),U=i(he,r.interactiveDebounce));n.triggerTarget&&!r.triggerTarget?a(n.triggerTarget).forEach((function(e){e.removeAttribute("aria-expanded")})):r.triggerTarget&&e.removeAttribute("aria-expanded");se(),re(),J&&J(n,r);z.popperInstance&&Te();oe("onAfterUpdate",[z,t])},setContent:function(e){z.setProps({content:e})},show:function(){var e=z.state.isVisible,t=z.state.isDestroyed,r=!z.state.isEnabled,i=k.isTouch&&!z.props.touch,o=n(z.props.duration,0,f.duration);if(e||t||r||i)return;if(ee().hasAttribute("disabled"))return;if(oe("onShow",[z],!1),!1===z.props.onShow(z))return;z.state.isVisible=!0,W.style.visibility="visible",re(),pe(),W.style.transition="none",O=function(){if(z.state.isVisible&&!_){if(_=!0,W.offsetHeight,W.style.transition=z.props.moveTransition,I(z.props.render)){var e=te(),t=e.box,n=e.content;z.props.animation&&(C([t,n],o),x([t,n],"visible"))}ae(),se(),s(N,z),ie(!0),z.state.isMounted=!0,oe("onMount",[z]),z.props.animation&&I(z.props.render)&&function(e,t){le(e,t)}(o,(function(){z.state.isShown=!0,oe("onShown",[z])}))}},function(){var e,t=z.props.appendTo,n=ee();z.props.interactive&&t===f.appendTo||"parent"===t?e=n.parentNode:(i=[n],e="function"==typeof(r=t)?r.apply(void 0,i):r);var r,i;e.contains(W)||e.appendChild(W);Te()}()},hide:function(){var e=!z.state.isVisible,t=z.state.isDestroyed,r=!z.state.isEnabled,i=n(z.props.duration,1,f.duration);if(e||t||r)return;if(oe("onHide",[z],!1),!1===z.props.onHide(z))return;if(z.state.isVisible=!1,z.state.isShown=!1,W.style.visibility="hidden",_=!1,ue(),fe(),re(),I(z.props.render)){var o=te(),a=o.box,s=o.content;z.props.animation&&(C([a,s],i),x([a,s],"hidden"))}ae(),se(),z.props.animation&&I(z.props.render)&&function(e,t){le(e,(function(){!z.state.isVisible&&W.parentNode&&W.parentNode.contains(W)&&t()}))}(i,xe)},enable:function(){z.state.isEnabled=!0},disable:function(){z.hide(),z.state.isEnabled=!1},unmount:xe,destroy:function(){if(z.state.isDestroyed)return;z.clearDelayTimeouts(),z.unmount(),ge(),delete e._tippy,z.state.isDestroyed=!0,oe("onDestroy",[z])}};if(!j.render)return z;var $=j.render(z),W=$.popper,J=$.update;W.setAttribute("data-tippy-root",""),W.id="tippy-"+z.id,z.popper=W,e._tippy=z,W._tippy=z;var G=Y.map((function(e){return e.fn(z)})),K=e.hasAttribute("aria-expanded");return ve(),se(),oe("onCreate",[z]),j.showOnCreate&&Ae(),W.addEventListener("mouseenter",(function(){z.props.interactive&&z.state.isVisible&&z.clearDelayTimeouts()})),W.addEventListener("mouseleave",(function(){z.props.interactive&&z.props.trigger.indexOf("mouseenter")>=0&&q.addEventListener("mousemove",U)})),z;function Q(){var e=z.props.touch;return Array.isArray(e)?e:[e,0]}function Z(){return"hold"===Q()[0]}function ee(){return A||e}function te(){return S(W)}function ne(e){return z.state.isMounted&&!z.state.isVisible||k.isTouch||m&&"focus"===m.type?0:n(z.props.delay,e?0:1,f.delay)}function re(){W.style.pointerEvents=z.props.interactive&&z.state.isVisible?"":"none"}function ie(e){var t=e&&b&&k.isTouch;q.body.classList[t?"add":"remove"]("tippy-iOS")}function oe(e,t,n){var r;(void 0===n&&(n=!0),G.forEach((function(n){n[e]&&n[e].apply(void 0,t)})),n)&&(r=z.props)[e].apply(r,t)}function ae(){var t=z.props.aria;if(t){var n="aria-"+t,r=W.id;a(z.props.triggerTarget||e).forEach((function(e){var t=e.getAttribute(n);if(z.state.isVisible)e.setAttribute(n,t?t+" "+r:r);else{var i=t&&t.replace(r,"").trim();i?e.setAttribute(n,i):e.removeAttribute(n)}}))}}function se(){K||a(z.props.triggerTarget||e).forEach((function(e){z.props.interactive?e.setAttribute("aria-expanded",z.state.isVisible&&e===ee()?"true":"false"):e.removeAttribute("aria-expanded")}))}function ue(){q.body.removeEventListener("mouseleave",Ce),q.removeEventListener("mousemove",U),H=H.filter((function(e){return e!==U}))}function ce(e){if(!z.props.interactive||!W.contains(e.target)){if(ee().contains(e.target)){if(k.isTouch)return;if(z.state.isVisible&&z.props.trigger.indexOf("click")>=0)return}!0===z.props.hideOnClick&&(R=!1,z.clearDelayTimeouts(),z.hide(),M=!0,setTimeout((function(){M=!1})),z.state.isMounted||fe())}}function pe(){q.addEventListener("mousedown",ce,!0)}function fe(){q.removeEventListener("mousedown",ce,!0)}function le(e,t){var n=te().box;function r(e){e.target===n&&(P(n,"remove",r),t())}if(0===e)return t();P(n,"remove",T),P(n,"add",r),T=r}function de(t,n,r){void 0===r&&(r=!1),a(z.props.triggerTarget||e).forEach((function(e){e.addEventListener(t,n,r),F.push({node:e,eventType:t,handler:n,options:r})}))}function ve(){var e;Z()&&(de("touchstart",me,y),de("touchend",be,y)),(e=z.props.trigger,e.split(/\s+/).filter(Boolean)).forEach((function(e){if("manual"!==e)switch(de(e,me),e){case"mouseenter":de("mouseleave",be);break;case"focus":de(h?"focusout":"blur",ye);break;case"focusin":de("focusout",ye)}}))}function ge(){F.forEach((function(e){var t=e.node,n=e.eventType,r=e.handler,i=e.options;t.removeEventListener(n,r,i)})),F=[]}function me(e){var t=!1;if(z.state.isEnabled&&!we(e)&&!M){if(m=e,A=e.currentTarget,se(),!z.state.isVisible&&E(e)&&H.forEach((function(t){return t(e)})),"click"===e.type&&(z.props.trigger.indexOf("mouseenter")<0||R)&&!1!==z.props.hideOnClick&&z.state.isVisible)t=!0;else{var n=Q(),r=n[0],i=n[1];k.isTouch&&"hold"===r&&i?o=setTimeout((function(){Ae(e)}),i):Ae(e)}"click"===e.type&&(R=!t),t&&Ce(e)}}function he(t){D(t.target,(function(t){return t===e||t===W}))||function(e,t){var n=t.clientX,r=t.clientY;return e.every((function(e){var t=e.basePlacement,i=e.popperRect,o=e.props,a=e.offsetData,s=o.interactiveBorder,u="bottom"===t?a.top.y:0,c="top"===t?a.bottom.y:0,p="right"===t?a.left.x:0,f="left"===t?a.right.x:0,l=i.top-r+u>s,d=r-i.bottom-c>s,v=i.left-n+p>s,g=n-i.right-f>s;return l||d||v||g}))}(Oe().concat(W).map((function(e){var t=e._tippy;return t.popperInstance?{popperRect:e.getBoundingClientRect(),basePlacement:c(t.state.currentPlacement),offsetData:t.popperInstance.state.modifiersData.offset,props:j}:null})).filter(Boolean),t)&&(ue(),Ce(t))}function be(e){if(!(we(e)||z.props.trigger.indexOf("click")>=0&&R))return z.props.interactive?(q.body.addEventListener("mouseleave",Ce),q.addEventListener("mousemove",U),void s(H,U)):void Ce(e)}function ye(e){z.props.trigger.indexOf("focusin")<0&&e.target!==ee()||z.props.interactive&&e.relatedTarget&&W.contains(e.relatedTarget)||Ce(e)}function we(e){var t="ontouchstart"in window,n=e.type.indexOf("touch")>=0,r=Z();return t&&k.isTouch&&r&&!n||k.isTouch&&!r&&n}function Te(){Ee();var n=z.props,r=n.popperOptions,i=n.placement,o=n.offset,a=n.getReferenceClientRect,s=n.moveTransition,c=I(z.props.render)?S(W).arrow:null,p=a?{getBoundingClientRect:a}:e,f={name:"$$tippy",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:function(e){var t=e.state;I(z.props.render)&&(delete t.attributes.popper["data-popper-placement"],te().box.setAttribute("data-placement",t.placement)),z.state.currentPlacement=t.placement}},l={name:"arrow",enabled:!!c,options:{element:c,padding:3}},d=[].concat((null==r?void 0:r.modifiers)||[],[{name:"offset",options:{offset:o}},{name:"preventOverflow",options:{padding:{top:2,bottom:2,left:5,right:5}}},{name:"flip",options:{padding:{top:2,bottom:2,left:5,right:5}}},{name:"computeStyles",options:{adaptive:!s}},f]).concat(I(z.props.render)?[l]:[]);z.popperInstance=t.createPopper(p,W,Object.assign({},r,{placement:i,onFirstUpdate:O,modifiers:[u(d,"offset"),u(d,"arrow"),u(d,"preventOverflow"),u(d,"flip"),u(d,"computeStyles")].concat(d)}))}function Ee(){z.popperInstance&&(z.popperInstance.destroy(),z.popperInstance=null)}function Oe(){return p(W.querySelectorAll("[data-tippy-root]"))}function Ae(e){z.clearDelayTimeouts(),e&&oe("onTrigger",[z,e]),pe();var t=ne(!0);t?o=setTimeout((function(){z.show()}),t):z.show()}function Ce(e){if(z.clearDelayTimeouts(),oe("onUntrigger",[z,e]),z.state.isVisible){if(!(z.props.trigger.indexOf("mouseenter")>=0&&z.props.trigger.indexOf("click")>=0&&["mouseleave","mousemove"].indexOf(e.type)>=0&&R)){var t=ne(!1);t?l=setTimeout((function(){z.state.isVisible&&z.hide()}),t):g=requestAnimationFrame((function(){z.hide()}))}}else fe()}function xe(){Ee(),Oe().forEach((function(e){e._tippy.unmount()})),W.parentNode&&W.parentNode.removeChild(W),0===(N=N.filter((function(e){return e!==z}))).length&&ie(!1),z.state.isMounted=!1,oe("onHidden",[z])}}function F(e,t){void 0===t&&(t={});var n=f.plugins.concat(t.plugins||[]);document.addEventListener("touchstart",j,Object.assign({},y,{capture:!0})),window.addEventListener("blur",M);var r=Object.assign({},t,{plugins:n}),i=A(e).reduce((function(e,t){var n=t&&_(t,r);return n&&e.push(n),e}),[]);return T(e)?i[0]:i}F.defaultProps=f,F.setDefaultProps=function(e){Object.keys(e).forEach((function(t){f[t]=e[t]}))},F.currentInput=k;var U={mouseover:"mouseenter",focusin:"focus",click:"click"};var q={name:"animateFill",defaultValue:!1,fn:function(e){var t=S(e.popper),n=t.box,r=t.content,i=e.props.animateFill?function(){var e=w();return e.className="tippy-backdrop",x([e],"hidden"),e}():null;return{onCreate:function(){i&&(n.insertBefore(i,n.firstElementChild),n.setAttribute("data-animatefill",""),n.style.overflow="hidden",e.setProps({arrow:!1,animation:"shift-away"}))},onMount:function(){if(i){var e=n.style.transitionDuration,t=Number(e.replace("ms",""));r.style.transitionDelay=Math.round(t/10)+"ms",i.style.transitionDuration=e,x([i],"visible")}},onShow:function(){i&&(i.style.transitionDuration="0ms")},onHide:function(){i&&x([i],"hidden")}}}};var X={name:"followCursor",defaultValue:!1,fn:function(e){var t,n=e.reference,r=L(e.props.triggerTarget||n),i=null;function o(){return"manual"===e.props.trigger.trim()}function a(){var t=!!o()||null!==i&&!(0===i.clientX&&0===i.clientY);return e.props.followCursor&&t}function s(){e.setProps({getReferenceClientRect:null})}function u(){a()?r.addEventListener("mousemove",p):s()}function c(){r.removeEventListener("mousemove",p)}function p(r){var i=t=r,o=i.clientX,a=i.clientY,s=D(r.target,(function(e){return e===n})),u=e.props.followCursor;!s&&e.props.interactive||e.setProps({getReferenceClientRect:function(){var e=n.getBoundingClientRect();return{width:0,height:0,top:"horizontal"===u?e.top:a,bottom:"horizontal"===u?e.bottom:a,left:"vertical"===u?e.left:o,right:"vertical"===u?e.right:o}}}),(k.isTouch||"initial"===e.props.followCursor&&e.state.isVisible)&&c()}return{onMount:function(){a()&&p(t)},onShow:function(){o()&&(t=i={clientX:0,clientY:0},u())},onTrigger:function(e,n){i||(E(n)&&(i={clientX:n.clientX,clientY:n.clientY},t=n),u())},onUntrigger:function(){e.state.isVisible||(c(),i=null)},onHidden:function(){c(),s(),i=null}}}},Y={name:"inlinePositioning",defaultValue:!1,fn:function(e){var t,n=e.reference;var r={name:"tippyInlinePositioning",enabled:!0,phase:"afterWrite",fn:function(r){var i=r.state;e.props.inlinePositioning&&(t!==i.placement&&e.setProps({getReferenceClientRect:function(){return function(e){return function(e,t,n){if(n.length<2||null===e)return t;switch(e){case"top":case"bottom":var r=n[0],i=n[n.length-1],o="top"===e,a=r.top,s=i.bottom,u=o?r.left:i.left,c=o?r.right:i.right;return{top:a,bottom:s,left:u,right:c,width:c-u,height:s-a};case"left":case"right":var p=Math.min.apply(Math,n.map((function(e){return e.left}))),f=Math.max.apply(Math,n.map((function(e){return e.right}))),l=n.filter((function(t){return"left"===e?t.left===p:t.right===f})),d=l[0].top,v=l[l.length-1].bottom;return{top:d,bottom:v,left:p,right:f,width:f-p,height:v-d};default:return t}}(c(e),n.getBoundingClientRect(),p(n.getClientRects()))}(i.placement)}}),t=i.placement)}};return{onCreate:function(){var t;e.setProps({popperOptions:{modifiers:[].concat((null==(t=e.popperInstance)?void 0:t.state.options.modifiers)||[],[r])}})}}}};var z={name:"sticky",defaultValue:!1,fn:function(e){var t=e.reference,n=e.popper;function r(t){return!0===e.props.sticky||e.props.sticky===t}var i=null,o=null;function a(){var s=r("reference")?(e.popperInstance?e.popperInstance.state.elements.reference:t).getBoundingClientRect():null,u=r("popper")?n.getBoundingClientRect():null;(s&&$(i,s)||u&&$(o,u))&&e.popperInstance&&e.popperInstance.update(),i=s,o=u,e.state.isMounted&&requestAnimationFrame(a)}return{onMount:function(){e.props.sticky&&a()}}}};function $(e,t){return!e||!t||(e.top!==t.top||e.right!==t.right||e.bottom!==t.bottom||e.left!==t.left)}e.animateFill=q,e.createSingleton=function(e,t){var n;void 0===t&&(t={}),e.forEach((function(e){e.disable()}));var r=e.map((function(e){return e.reference})),i={fn:function(){return{onDestroy:function(){e.forEach((function(e){e.enable()}))},onTrigger:function(i,o){var a=o.currentTarget,s=r.indexOf(a);if(a!==n){n=a;var u=(t.overrides||[]).concat("content").reduce((function(t,n){return t[n]=e[s].props[n],t}),{});i.setProps(Object.assign({},u,{getReferenceClientRect:function(){return a.getBoundingClientRect()}}))}}}}};return F(w(),Object.assign({},o(t,["overrides"]),{plugins:[i].concat(t.plugins||[]),triggerTarget:r}))},e.default=F,e.delegate=function(e,t){var n=[],r=[],i=t.target,s=o(t,["target"]),u=Object.assign({},s,{trigger:"manual"}),c=Object.assign({},s,{showOnCreate:!0}),p=F(e,u);function l(e){if(e.target){var n=e.target.closest(i);if(n)if(!((n.getAttribute("data-tippy-trigger")||t.trigger||f.trigger).indexOf(U[e.type])<0||n._tippy)){var o=F(n,c);o&&(r=r.concat(o))}}}function d(e,t,r,i){void 0===i&&(i=!1),e.addEventListener(t,r,i),n.push({node:e,eventType:t,handler:r,options:i})}return a(p).forEach((function(e){var t=e.destroy;e.destroy=function(e){void 0===e&&(e=!0),e&&r.forEach((function(e){e.destroy()})),r=[],n.forEach((function(e){var t=e.node,n=e.eventType,r=e.handler,i=e.options;t.removeEventListener(n,r,i)})),n=[],t()},function(e){var t=e.reference;d(t,"mouseover",l),d(t,"focusin",l),d(t,"click",l)}(e)})),p},e.followCursor=X,e.hideAll=function(e){var t=void 0===e?{}:e,n=t.exclude,r=t.duration;N.forEach((function(e){var t=!1;if(n&&(t=O(n)?e.reference===n:e.popper===n.popper),!t){var i=e.props.duration;e.setProps({duration:r}),e.hide(),e.setProps({duration:i})}}))},e.inlinePositioning=Y,e.roundArrow='<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 6s1.796-.013 4.67-3.615C5.851.9 6.93.006 8 0c1.07-.006 2.148.887 3.343 2.385C14.233 6.005 16 6 16 6H0z"></svg>',e.sticky=z}));
//# sourceMappingURL=tippy-headless.umd.min.js.map