@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-f0de5c73.js";import{b as h,a}from"./align-floating-elements-db77d917.js";import{f as o}from"./component-names-6ca7e863.js";import{i as n}from"./prop.validators-64749272.js";import{g as l}from"./dev.utils-fab45cbc.js";import{v as d}from"./badge-text-65c680b2.js";import{a as r}from"./align-878fb132.js";import{v as c}from"./label-e8ec0e3a.js";import"./reuse-32931294.js";import"./index-da3e0c00.js";const f=(t,e)=>{n(t,"_id",e)},u=new Set;function m(t){u.forEach((t=>{t.style.setProperty("z-index","999")})),u.add(t),t.style.setProperty("z-index","1000")}function p(t){if(u.delete(t),u.size>0){const t=Array.from(u).pop();t&&t.style.setProperty("z-index","1000")}}const v=class{constructor(e){t(this,e),this.hasFocusIn=!1,this.hasMouseIn=!1,this.showTooltip=()=>{if(this.previousSibling&&this.tooltipElement){m(this.tooltipElement),this.tooltipElement.style.setProperty("display","block"),l().addEventListener("keyup",this.hideTooltipByEscape);const t=this.previousSibling,e=this.tooltipElement;this.cleanupAutoPositioning=h(t,e,(()=>{this.alignTooltip()}))}},this.hideTooltip=()=>{this.tooltipElement&&(p(this.tooltipElement),this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),this.cleanupAutoPositioning&&(this.cleanupAutoPositioning(),this.cleanupAutoPositioning=void 0)),l().removeEventListener("keyup",this.hideTooltipByEscape)},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.showOrHideTooltip=()=>{clearTimeout(this.overFocusTimeout),this.overFocusTimeout=setTimeout((()=>{this.hasMouseIn||this.hasFocusIn?this.showTooltip():this.hideTooltip()}),300)},this._badgeText=void 0,this._align="top",this._id=void 0,this._label=void 0,this.state={_align:"top",_label:""}}async alignTooltip(){this.tooltipElement&&this.previousSibling&&await a({align:this._align,referenceElement:this.previousSibling,arrowElement:this.arrowElement,floatingElement:this.tooltipElement})}handleMouseEnter(){this.hasMouseIn=!0,this.showOrHideTooltip()}handleMouseleave(){this.hasMouseIn=!1,this.showOrHideTooltip()}handleFocusIn(){this.hasFocusIn=!0,this.showOrHideTooltip()}handleFocusout(){this.hasFocusIn=!1,this.showOrHideTooltip()}render(){return i(s,{key:"1c451d0dd4961d747400c009d047fee03ff0ec59",class:"kol-tooltip-wc"},""!==this.state._label&&i("div",{key:"6879df2a08610759e1cfadf6421d4eba1e8c9e5a",class:"tooltip-floating",ref:this.catchTooltipElement},i("div",{key:"ea902b518257361bd6dffe53806177097383707c",class:"tooltip-area tooltip-arrow",ref:this.catchArrowElement}),i(o,{key:"a54da5c444f87328dc15acce24d429412c405595",class:"tooltip-area tooltip-content",id:this.state._id,_badgeText:this._badgeText,_label:this.state._label})))}validateBadgeText(t){d(this,t)}validateAlign(t){r(this,t)}validateId(t){f(this,t)}validateLabel(t){c(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{v as kol_tooltip_wc};