axentix/dist/components/tooltip/tooltip.min.js

Axentix is a framework mixing fully customizable components & utility-first classes, leaving the design choice to the developer.

(function(o,n){typeof exports=="object"&&typeof module!="undefined"?module.exports=n():typeof define=="function"&&define.amd?define(n):(o=typeof globalThis!="undefined"?globalThis:o||self,o.Tooltip=n())})(this,function(){"use strict";var K=Object.defineProperty;var S=o=>{throw TypeError(o)};var Q=(o,n,h)=>n in o?K(o,n,{enumerable:!0,configurable:!0,writable:!0,value:h}):o[n]=h;var T=(o,n,h)=>Q(o,typeof n!="symbol"?n+"":n,h),b=(o,n,h)=>n.has(o)||S("Cannot "+h);var e=(o,n,h)=>(b(o,n,"read from private field"),h?h.call(o):n.get(o)),f=(o,n,h)=>n.has(o)?S("Cannot add the same private member more than once"):n instanceof WeakSet?n.add(o):n.set(o,h),c=(o,n,h,O)=>(b(o,n,"write to private field"),O?O.call(o,h):n.set(o,h),h),L=(o,n,h)=>(b(o,n,"access private method"),h);var r,E,y,x,g,v,l,m,d,I,k,q,N,U;const o=[],n={components:[],plugins:[],prefix:"ax",mode:""},h=s=>n.components.find(i=>i.name===s).class,O=()=>{const s=n.components.filter(t=>t.dataDetection),i=n.plugins.filter(t=>t.dataDetection);return[...s,...i].map(t=>t.name)},V=(s,i)=>{if(!s.name||!s.class){console.error(`[Axentix] Error registering ${i} : Missing required parameters.`);return}if(n[i].some(t=>t.name===s.name)){console.error(`[Axentix] Error registering ${i} : Already exist.`);return}s.autoInit&&(s.autoInit.selector=s.autoInit.selector+=":not(.no-axentix-init)"),n[i].push(s)},z=s=>{V(s,"components")},B=s=>s.replace(/[\w]([A-Z])/g,i=>i[0]+"-"+i[1]).toLowerCase(),F=(s,i="")=>{const t=B(s);return i?i+"-"+t:t},H=(s,i,t,p,u="")=>{const a=i[0].toUpperCase()+i.slice(1).toLowerCase();O().includes(a)&&t!=="Collapsible"&&a!=="Sidenav"&&(s[i]=h(a).getDefaultOptions());const w=u?u+"-"+i:i,C=R(s[i],t,p,w);if(!(Object.keys(C).length===0&&s.constructor===Object))return C},R=(s,i,t,p="")=>Object.keys(s).reduce((u,a)=>{if(typeof s[a]=="object"&&s[a]!==null){const w=H(s,a,i,t,p);w&&(u[a]=w)}else if(s[a]!==null){const w="data-"+i.toLowerCase()+"-"+F(a,p);if(t.hasAttribute(w)){const C=t.getAttribute(w);u[a]=typeof s[a]=="number"?Number(C):C,typeof s[a]=="boolean"&&(u[a]=C==="true")}}return u},{}),M=(s,i)=>{const t=Object.assign({},h(s).getDefaultOptions());return R(t,s,i)},Y=()=>{document.querySelectorAll("[data-ax]").forEach(i=>{let t=i.dataset.ax;if(t=t[0].toUpperCase()+t.slice(1).toLowerCase(),!O().includes(t)){console.error(`[Axentix] Error: ${t} component doesn't exist. 
 Did you forget to register him ?`,i);return}try{const p=h(t);new p(`#${i.id}`)}catch(p){console.error("[Axentix] Data: Unable to load "+t,p)}})},X=()=>{try{new Axentix.Axentix("all")}catch(s){console.error("[Axentix] Unable to auto init.",s)}};document.addEventListener("DOMContentLoaded",()=>{document.documentElement.dataset.axentix&&X(),Y()});const $=(...s)=>s.reduce((i,t)=>{for(let p in t)i[p]=typeof t[p]=="object"&&t[p]!==null?$(i[p],t[p]):t[p];return i},{}),P=(s,i,t)=>$(h(s).getDefaultOptions(),M(s,t),i),D=(s,i,t)=>{const p=new CustomEvent("ax."+i,{detail:{},bubbles:!0});s.dispatchEvent(p)},Z=s=>{const i=o.find(t=>t.type!=="Toast"&&"#"+t.instance.el.id===s);return i?i.instance:!1};class G{constructor(){T(this,"el")}removeListeners(){}setupListeners(){}setup(){}preventDbInstance(i){if(i&&Z(i))throw new Error(`Instance already exist on ${i}`)}sync(){D(this.el,"component.sync"),this.removeListeners(),this.setupListeners()}reset(){D(this.el,"component.reset"),this.removeListeners(),this.setup()}destroy(){D(this.el,"component.destroy"),this.removeListeners();const i=o.findIndex(t=>t.instance.el.id===this.el.id);o.splice(i,1)}}const J={content:"",animationDelay:0,offset:"10px",animationDuration:200,classes:"grey dark-4 light-shadow-2 p-2",position:"top"};class A extends G{constructor(t,p){super();f(this,d);T(this,"options");f(this,r);f(this,E);f(this,y);f(this,x);f(this,g);f(this,v);f(this,l);f(this,m);try{this.preventDbInstance(t),o.push({type:"Tooltip",instance:this}),this.el=document.querySelector(t),this.options=P("Tooltip",p,this.el),this.setup()}catch(u){console.error("[Axentix] Tooltip init error",u)}}setup(){if(!this.options.content)return console.error(`Tooltip #${this.el.id} : empty content.`);D(this.el,"tooltip.setup"),this.options.position=this.options.position.toLowerCase(),document.querySelectorAll(".tooltip").forEach(p=>{p.dataset.tooltipId&&p.dataset.tooltipId===this.el.id&&c(this,r,p)}),e(this,r)||c(this,r,document.createElement("div")),e(this,r).dataset.tooltipId!==this.el.id&&(e(this,r).dataset.tooltipId=this.el.id),L(this,d,I).call(this),document.body.appendChild(e(this,r)),c(this,E,["right","left","top","bottom"]),e(this,E).includes(this.options.position)||(this.options.position="top"),this.setupListeners(),this.updatePosition(),e(this,r).style.display="none"}setupListeners(){c(this,y,L(this,d,N).bind(this)),c(this,x,L(this,d,U).bind(this)),c(this,g,this.updatePosition.bind(this)),this.el.addEventListener("mouseenter",e(this,y)),this.el.addEventListener("mouseleave",e(this,x)),window.addEventListener("resize",e(this,g))}removeListeners(){this.el.removeEventListener("mouseenter",e(this,y)),this.el.removeEventListener("mouseleave",e(this,x)),window.removeEventListener("resize",e(this,g)),c(this,y,void 0),c(this,x,void 0),c(this,g,void 0)}updatePosition(){c(this,l,this.el.getBoundingClientRect()),L(this,d,k).call(this),c(this,m,e(this,r).getBoundingClientRect()),L(this,d,q).call(this)}show(){e(this,r).style.display="block",this.updatePosition(),clearTimeout(e(this,v)),c(this,v,setTimeout(()=>{D(this.el,"tooltip.show");const t=this.options.position=="top"||this.options.position=="left"?"-":"",p=this.options.position=="top"||this.options.position=="bottom"?"Y":"X";e(this,r).style.transform=`translate${p}(${t}${this.options.offset})`,e(this,r).style.opacity="1"},this.options.animationDelay))}hide(){D(this.el,"tooltip.hide"),clearTimeout(e(this,v)),e(this,r).style.transform="translate(0)",e(this,r).style.opacity="0",c(this,v,setTimeout(()=>{e(this,r).style.display="none"},this.options.animationDuration))}change(t){this.options=P("Tooltip",t,this.el),e(this,E).includes(this.options.position)||(this.options.position="top"),L(this,d,I).call(this),this.updatePosition()}}return r=new WeakMap,E=new WeakMap,y=new WeakMap,x=new WeakMap,g=new WeakMap,v=new WeakMap,l=new WeakMap,m=new WeakMap,d=new WeakSet,I=function(){e(this,r).style.transform="translate(0)",e(this,r).style.opacity="0",e(this,r).className="tooltip "+this.options.classes,e(this,r).style.transitionDuration=this.options.animationDuration+"ms",e(this,r).innerHTML=this.options.content},k=function(){if(this.options.position=="top"||this.options.position=="bottom"){const p=this.options.position==="top"?e(this,l).top:e(this,l).top+e(this,l).height;e(this,r).style.top=p+"px"}else this.options.position=="right"&&(e(this,r).style.left=e(this,l).left+e(this,l).width+"px")},q=function(){this.options.position=="top"||this.options.position=="bottom"?e(this,r).style.left=e(this,l).left+e(this,l).width/2-e(this,m).width/2+"px":e(this,r).style.top=e(this,l).top+e(this,l).height/2-e(this,m).height/2+"px",this.options.position=="top"?e(this,r).style.top=e(this,m).top-e(this,m).height+"px":this.options.position=="left"&&(e(this,r).style.left=e(this,l).left-e(this,m).width+"px");const p=window.scrollY,u=parseFloat(e(this,r).style.top);this.options.position==="top"?e(this,r).style.top=p*2+u+"px":e(this,r).style.top=p+u+"px"},N=function(t){t.preventDefault(),this.show()},U=function(t){t.preventDefault(),this.hide()},T(A,"getDefaultOptions",()=>J),z({class:A,name:"Tooltip",dataDetection:!0}),A});