@spider-ui/tooltip/lib/tooltip.cjs.js

Bare tooltip web element.

/*!
  * @license MIT (https://github.com/geotrev/spider-ui/blob/master/LICENSE)
  * @spider-ui/tooltip v0.2.7 (https://github.com/geotrev/spider-ui/tree/master/packages/tooltip#readme)
  * Copyright 2020 George Treviranus <hello@geotrev.com>
  */
"use strict";var t=require("upgraded-element"),o=require("@spider-ui/global-event-registry");function r(t,o){for(var r=0;r<o.length;r++){var e=o[r];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function e(t,o,e){return o&&r(t.prototype,o),e&&r(t,e),t}function n(t){return(n=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function l(t,o){return(l=Object.setPrototypeOf||function(t,o){return t.__proto__=o,t})(t,o)}function i(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function s(t,o){return!o||"object"!=typeof o&&"function"!=typeof o?i(t):o}function d(t){var o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(t){return!1}}();return function(){var r,e=n(t);if(o){var l=n(this).constructor;r=Reflect.construct(e,arguments,l)}else r=e.apply(this,arguments);return s(this,r)}}var a="position",c="mode",h="show-arrow",b="delay",f="delay-on",p="delay-off",u="aria-describedby",g="role",w={BLOCK_START:"block-start",BLOCK_END:"block-end",INLINE_START:"inline-start",INLINE_END:"inline-end"},k={DARK:"dark",LIGHT:"light"},x="arrow",m="visible",v="hidden",y="[slot='trigger']",L="[slot='content']",T=function(r){!function(t,o){if("function"!=typeof o&&null!==o)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(o&&o.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),o&&l(t,o)}(s,t.UpgradedElement);var n=d(s);function s(){var t;return function(t,o){if(!(t instanceof o))throw new TypeError("Cannot call a class as a function")}(this,s),(t=n.call(this)).handleOpen=t.handleOpen.bind(i(t)),t.handleClose=t.handleClose.bind(i(t)),t.handleKeydown=t.handleKeydown.bind(i(t)),t.removeTimeout=t.removeTimeout.bind(i(t)),t}return e(s,[{key:"classNames",get:function(){var t=function(t){return Object.keys(t).map((function(o){return t[o]}))},o=this.hasAttribute(h),r=this.getAttribute(a),e=this.getAttribute(c),n=t(w),l=t(k);return{position:n.includes(r)?r:w.BLOCK_START,mode:l.includes(e)?e:k.DARK,arrow:o?x:"",visible:this.isVisible?m:v}}}],[{key:"properties",get:function(){return{isVisible:{type:"boolean",default:!1}}}},{key:"styles",get:function(){return'/*! minireset.css v0.0.5 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:start}:host{display:inline-block}:host[hidden]{display:none}.tooltip{position:relative;display:inline-block}::slotted([slot=content]){font-size:14px;padding:4px 8px;border-radius:4px;position:absolute;display:block;transition:opacity cubic-bezier(0.12, 0.72, 0.58, 1.03) 100ms;word-wrap:break-word;white-space:nowrap;text-align:center}.light ::slotted([slot=content]){border:1px solid #dedede;background:#fff;color:#111}.dark ::slotted([slot=content]){border:1px solid #111;background:#111;color:#fff}.hidden ::slotted([slot=content]){pointer-events:none;opacity:0}.visible ::slotted([slot=content]){pointer-events:auto;opacity:1}.block-start ::slotted([slot=content]){bottom:100%;margin:0 0 7px 0}.inline-end ::slotted([slot=content]){margin-top:0;margin-bottom:0;bottom:auto;top:0}:root:not([dir=rtl]) .inline-end ::slotted([slot=content]),:host(:not([dir=rtl])) .inline-end ::slotted([slot=content]){left:100%}:root[dir=rtl] .inline-end ::slotted([slot=content]),:host([dir=rtl]) .inline-end ::slotted([slot=content]){right:100%}:root:not([dir=rtl]) .inline-end ::slotted([slot=content]),:host(:not([dir=rtl])) .inline-end ::slotted([slot=content]){margin-left:7px}:root[dir=rtl] .inline-end ::slotted([slot=content]),:host([dir=rtl]) .inline-end ::slotted([slot=content]){margin-right:7px}.inline-start ::slotted([slot=content]){margin-top:0;margin-bottom:0;bottom:auto;top:0}:root:not([dir=rtl]) .inline-start ::slotted([slot=content]),:host(:not([dir=rtl])) .inline-start ::slotted([slot=content]){right:100%}:root[dir=rtl] .inline-start ::slotted([slot=content]),:host([dir=rtl]) .inline-start ::slotted([slot=content]){left:100%}:root:not([dir=rtl]) .inline-start ::slotted([slot=content]),:host(:not([dir=rtl])) .inline-start ::slotted([slot=content]){left:auto}:root[dir=rtl] .inline-start ::slotted([slot=content]),:host([dir=rtl]) .inline-start ::slotted([slot=content]){right:auto}:root:not([dir=rtl]) .inline-start ::slotted([slot=content]),:host(:not([dir=rtl])) .inline-start ::slotted([slot=content]){margin-right:7px}:root[dir=rtl] .inline-start ::slotted([slot=content]),:host([dir=rtl]) .inline-start ::slotted([slot=content]){margin-left:7px}.block-end ::slotted([slot=content]){top:100%;margin:7px 0 0 0;bottom:auto}.dark.block-start.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;bottom:-12.5px;top:auto;border-top:7px solid #111}:root:not([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.block-start.arrow ::slotted([slot=content])::after{left:calc(50% - 7px)}:root[dir=rtl] .dark.block-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::after{right:calc(50% - 7px)}:root:not([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.block-start.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .dark.block-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::after{left:auto}.dark.block-start.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;bottom:-14px;top:auto;border-top:7px solid #111}:root:not([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.block-start.arrow ::slotted([slot=content])::before{left:calc(50% - 7px)}:root[dir=rtl] .dark.block-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::before{right:calc(50% - 7px)}:root:not([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.block-start.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .dark.block-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.block-start.arrow ::slotted([slot=content])::before{left:auto}.dark.inline-end.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::after{border-right:7px solid #111}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after{border-left:7px solid #111}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::after{left:-12.5px}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after{right:-12.5px}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::after{left:auto}.dark.inline-end.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::before{border-right:7px solid #111}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before{border-left:7px solid #111}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::before{left:-14px}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before{right:-14px}:root:not([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-end.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .dark.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-end.arrow ::slotted([slot=content])::before{left:auto}.dark.inline-start.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::after{border-left:7px solid #111}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after{border-right:7px solid #111}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::after{right:-12.5px}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after{left:-12.5px}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::after{left:auto}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::after{right:auto}.dark.inline-start.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::before{border-left:7px solid #111}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before{border-right:7px solid #111}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::before{right:-14px}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before{left:-14px}:root:not([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.inline-start.arrow ::slotted([slot=content])::before{left:auto}:root[dir=rtl] .dark.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.inline-start.arrow ::slotted([slot=content])::before{right:auto}.dark.block-end.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:-12.5px;bottom:auto;border-bottom:7px solid #111}:root:not([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.block-end.arrow ::slotted([slot=content])::after{left:calc(50% - 7px)}:root[dir=rtl] .dark.block-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::after{right:calc(50% - 7px)}:root:not([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .dark.block-end.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .dark.block-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::after{left:auto}.dark.block-end.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:-14px;bottom:auto;border-bottom:7px solid #111}:root:not([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.block-end.arrow ::slotted([slot=content])::before{left:calc(50% - 7px)}:root[dir=rtl] .dark.block-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::before{right:calc(50% - 7px)}:root:not([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .dark.block-end.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .dark.block-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .dark.block-end.arrow ::slotted([slot=content])::before{left:auto}.light.block-start.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;bottom:-12.5px;top:auto;border-top:7px solid #fff}:root:not([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.block-start.arrow ::slotted([slot=content])::after{left:calc(50% - 7px)}:root[dir=rtl] .light.block-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::after{right:calc(50% - 7px)}:root:not([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.block-start.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .light.block-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::after{left:auto}.light.block-start.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;bottom:-14px;top:auto;border-top:7px solid #dedede}:root:not([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.block-start.arrow ::slotted([slot=content])::before{left:calc(50% - 7px)}:root[dir=rtl] .light.block-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::before{right:calc(50% - 7px)}:root:not([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.block-start.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .light.block-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.block-start.arrow ::slotted([slot=content])::before{left:auto}.light.inline-end.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::after{border-right:7px solid #fff}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after{border-left:7px solid #fff}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::after{left:-12.5px}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after{right:-12.5px}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::after{left:auto}.light.inline-end.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::before{border-right:7px solid #dedede}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before{border-left:7px solid #dedede}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::before{left:-14px}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before{right:-14px}:root:not([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-end.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .light.inline-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-end.arrow ::slotted([slot=content])::before{left:auto}.light.inline-start.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::after{border-left:7px solid #fff}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after{border-right:7px solid #fff}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::after{right:-12.5px}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after{left:-12.5px}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::after{left:auto}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::after{right:auto}.light.inline-start.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:calc(50% - 7px);bottom:auto}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::before{border-left:7px solid #dedede}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before{border-right:7px solid #dedede}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::before{right:-14px}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before{left:-14px}:root:not([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.inline-start.arrow ::slotted([slot=content])::before{left:auto}:root[dir=rtl] .light.inline-start.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.inline-start.arrow ::slotted([slot=content])::before{right:auto}.light.block-end.arrow ::slotted([slot=content])::after{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:-12.5px;bottom:auto;border-bottom:7px solid #fff}:root:not([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.block-end.arrow ::slotted([slot=content])::after{left:calc(50% - 7px)}:root[dir=rtl] .light.block-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::after{right:calc(50% - 7px)}:root:not([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::after,:host(:not([dir=rtl])) .light.block-end.arrow ::slotted([slot=content])::after{right:auto}:root[dir=rtl] .light.block-end.arrow ::slotted([slot=content])::after,:host([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::after{left:auto}.light.block-end.arrow ::slotted([slot=content])::before{border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;border-top:7px solid transparent;content:"";position:absolute;top:-14px;bottom:auto;border-bottom:7px solid #dedede}:root:not([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.block-end.arrow ::slotted([slot=content])::before{left:calc(50% - 7px)}:root[dir=rtl] .light.block-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::before{right:calc(50% - 7px)}:root:not([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::before,:host(:not([dir=rtl])) .light.block-end.arrow ::slotted([slot=content])::before{right:auto}:root[dir=rtl] .light.block-end.arrow ::slotted([slot=content])::before,:host([dir=rtl]) .light.block-end.arrow ::slotted([slot=content])::before{left:auto}'}}]),e(s,[{key:"elementDidMount",value:function(){var t=this.querySelector(y),o=this.querySelector(L);t.setAttribute(u,this.elementId),o.id=this.elementId,o.setAttribute(g,"tooltip"),this.addOpenListeners(),this.addCloseListeners()}},{key:"elementWillUnmount",value:function(){this.handleOpen=null,this.handleClose=null,this.handleKeydown=null,this.removeTimeout=null,o.globalEventRegistry.unregister(this.elementId)}},{key:"elementDidUpdate",value:function(){this.isVisible?(this.isInlineTooltip()?this.alignTooltip("height"):this.alignTooltip("width"),o.globalEventRegistry.register({types:["keydown"],id:this.elementId,handler:this.handleKeydown})):o.globalEventRegistry.unregister(this.elementId)}},{key:"setDelay",value:function(){var t=this.getAttribute(f),o=this.getAttribute(p),r=this.getAttribute(b);this.delayOn=parseInt(t||r)||300,this.delayOff=parseInt(o||r)||300}},{key:"addOpenListeners",value:function(){this.addEventListener("focusin",this.handleOpen),this.addEventListener("focusin",this.handleOpen),this.addEventListener("mouseover",this.handleOpen),this.addEventListener("mouseover",this.handleOpen)}},{key:"addCloseListeners",value:function(){this.addEventListener("focusout",this.handleClose),this.addEventListener("focusout",this.handleClose),this.addEventListener("mouseout",this.handleClose),this.addEventListener("mouseout",this.handleClose)}},{key:"addOpenCancelListeners",value:function(){this.addEventListener("mouseout",this.removeTimeout),this.addEventListener("focusout",this.removeTimeout),this.addEventListener("mouseout",this.removeTimeout)}},{key:"addCloseCancelListeners",value:function(){this.addEventListener("mouseover",this.removeTimeout),this.addEventListener("focusin",this.removeTimeout),this.addEventListener("mouseover",this.removeTimeout)}},{key:"removeOpenCancelListeners",value:function(){this.removeEventListener("mouseout",this.removeTimeout),this.removeEventListener("focusout",this.removeTimeout),this.removeEventListener("mouseout",this.removeTimeout)}},{key:"removeCloseCancelListeners",value:function(){this.removeEventListener("mouseover",this.removeTimeout),this.removeEventListener("focusin",this.removeTimeout),this.removeEventListener("mouseover",this.removeTimeout)}},{key:"handleKeydown",value:function(t){this.isVisible&&"Escape"===t.key&&(this.removeTimeout(),this.removeCloseCancelListeners(),this.isVisible=!1)}},{key:"removeTimeout",value:function(){this.isConnected&&this.timeout&&(clearTimeout(this.timeout),this.timeout=null)}},{key:"handleOpen",value:function(){var t=this;if(!this.isVisible){var o=this;this.timeout=setTimeout((function(){o.isConnected&&(t.removeOpenCancelListeners(),t.timeout=null,t.isVisible=!0)}),this.delayOn),this.addOpenCancelListeners()}}},{key:"handleClose",value:function(){var t=this;if(this.isVisible){var o=this;this.timeout=setTimeout((function(){o.isConnected&&(t.removeCloseCancelListeners(),t.timeout=null,t.isVisible=!1)}),this.delayOff),this.addCloseCancelListeners()}}},{key:"alignTooltip",value:function(t){var o=this.querySelector(y),r=this.querySelector(L),e=this.getSize(o,t),n=this.getSize(r,t),l=e>n?(e-n)/2:(n-e)/-2;"height"===t?r.style.top="".concat(l,"px"):r.style.left="".concat(l,"px")}},{key:"getSize",value:function(t,o){return Math.floor(t.getBoundingClientRect()[o])}},{key:"isInlineTooltip",value:function(){var t=this.getAttribute(a);return[w.INLINE_START,w.INLINE_END].includes(t)}},{key:"render",value:function(){var t=this.classNames,o=t.position,r=t.mode,e=t.arrow,n=t.visible;return this.setDelay(),'\n      <div class="tooltip '.concat(n," ").concat(o," ").concat(r," ").concat(e,'">\n        <slot name="trigger"></slot>\n        <slot name="content"></slot>\n      </div>\n    ')}}]),s}();t.register("spider-tooltip",T);
//# sourceMappingURL=tooltip.cjs.js.map