@public-ui/components/dist/kolibri/kol-tooltip-wc.entry.js

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

/*!
 * KoliBri - The accessible HTML-Standard
 */
import{r as t,h as i,H as s,g as e}from"./index-CElQfBOC.js";import{b as h,a as o}from"./align-floating-elements-DcJPtpqg.js";import{e as a,A as n}from"./common-7RW_NFNf.js";import{v as l}from"./align-DoCRbhrp.js";import{v as r}from"./label-DAfXJvJZ.js";import"./Alert-BscBrOtx.js";import{K as d}from"./Span-EvVyGKjN.js";import"./i18n-yBVLeHdv.js";import"./Heading-D6_TFw6T.js";import"./clsx-eK3rPvPS.js";import"./component-names-CkE54Ym7.js";import"./bem-CwA0xXwr.js";import"./browser-D7tkBuSS.js";import"./Icon-DGehfe8Q.js";import"./markdown-RQjNjZ_M.js";import"./InternalUnderlinedBadgeText-DnxrXpNU.js";import"./isObject-DvSELytj.js";import"./i18n-CjhRejiw.js";const c=(t,e)=>{a(t,"_badgeText",e)},m=(t,e)=>{a(t,"_id",e)},f=new Set;function p(t){f.forEach((t=>{t.style.setProperty("z-index","999")})),f.add(t),t.style.setProperty("z-index","1000")}function u(t){if(f.delete(t),f.size>0){const t=Array.from(f).pop();t&&t.style.setProperty("z-index","1000")}}const v=300,b=class{constructor(e){t(this,e),this.showTooltip=()=>{if(this.previousSibling&&this.tooltipElement){p(this.tooltipElement),this.tooltipElement.style.setProperty("display","block"),n().addEventListener("keyup",this.hideTooltipByEscape);const t=this.previousSibling,e=this.tooltipElement;this.cleanupAutoPositioning=h(t,e,(()=>{this.alignTooltip()}))}},this.showTooltipWithDelay=()=>{clearTimeout(this.hideTooltipTimeout),clearTimeout(this.showTooltipTimeout),this.showTooltipTimeout=setTimeout((()=>{this.showTooltip()}),v)},this.hideTooltipWithDelay=()=>{clearTimeout(this.hideTooltipTimeout),this.hideTooltipTimeout=setTimeout((()=>{this.hideTooltip()}),v)},this.hideTooltipByEscape=t=>{"Escape"===t.key&&this.hideTooltip()},this.addListeners=t=>{t.addEventListener("mouseenter",this.handleMouseEnter.bind(this)),t.addEventListener("mouseleave",this.handleMouseleave.bind(this)),t.addEventListener("focusin",this.handleFocusIn.bind(this)),t.addEventListener("focusout",this.handleFocusout.bind(this))},this.removeListeners=t=>{t.removeEventListener("mouseenter",this.handleMouseEnter.bind(this)),t.removeEventListener("mouseleave",this.handleMouseleave.bind(this)),t.removeEventListener("focusin",this.handleFocusIn.bind(this)),t.removeEventListener("focusout",this.handleFocusout.bind(this))},this.resyncListeners=(t,e,i=!1)=>{t&&this.removeListeners(t),e&&(i&&(this.previousSibling=e),this.addListeners(e))},this.catchTooltipElement=t=>{this.tooltipElement=t},this.catchArrowElement=t=>{this.arrowElement=t},this._align="top",this.state={_align:"top",_label:""}}async alignTooltip(){this.tooltipElement&&this.previousSibling&&await o({align:this._align,referenceElement:this.previousSibling,arrowElement:this.arrowElement,floatingElement:this.tooltipElement})}async hideTooltip(){clearTimeout(this.showTooltipTimeout),this.tooltipElement&&(u(this.tooltipElement),this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),this.cleanupAutoPositioning&&(this.cleanupAutoPositioning(),this.cleanupAutoPositioning=void 0)),n().removeEventListener("keyup",this.hideTooltipByEscape)}handleMouseEnter(){this.showTooltipWithDelay()}handleMouseleave(){this.hideTooltipWithDelay()}handleFocusIn(){this.showTooltipWithDelay()}handleFocusout(){this.hideTooltipWithDelay()}render(){return i(s,{key:"60be1bd258bc5ae2b0ecce9374607d11476071b1",class:"kol-tooltip"},""!==this.state._label&&i("div",{key:"2af044756ca7d87c5b789181da84556a517c0ee4",class:"kol-tooltip__floating",ref:this.catchTooltipElement},i("div",{key:"057fc2de5c87f0f82e9477568992048bf3918e77",class:"kol-tooltip__arrow",ref:this.catchArrowElement}),i(d,{key:"1ba456fb877c04c0dc1e93431f90db07f2e90b47",class:"kol-tooltip__content",id:this.state._id,badgeText:this._badgeText,label:this.state._label})))}validateBadgeText(t){c(this,t)}validateAlign(t){l(this,t)}validateId(t){m(this,t)}validateLabel(t){r(this,t,{required:!0})}componentWillLoad(){this.validateBadgeText(this._badgeText),this.validateAlign(this._align),this.validateId(this._id),this.validateLabel(this._label)}handleEventListeners(){var t;this.resyncListeners(this.previousSibling,null===(t=this.host)||void 0===t?void 0:t.previousElementSibling,!0),this.resyncListeners(this.tooltipElement,this.tooltipElement)}connectedCallback(){var t;this.previousSibling=null===(t=this.host)||void 0===t?void 0:t.previousElementSibling}componentDidRender(){this.handleEventListeners()}disconnectedCallback(){this.previousSibling&&(this.removeListeners(this.previousSibling),this.previousSibling=void 0),this.tooltipElement&&this.removeListeners(this.tooltipElement),this.cleanupAutoPositioning&&this.cleanupAutoPositioning()}get host(){return e(this)}static get watchers(){return{_badgeText:["validateBadgeText"],_align:["validateAlign"],_id:["validateId"],_label:["validateLabel"]}}};export{b as kol_tooltip_wc};