UNPKG

@trendyol/baklava

Version:

Trendyol Baklava Design System

21 lines (20 loc) 1.75 kB
import{a as p}from"./chunk-GRL4DWKG.js";import{a as s,b as a,d as o}from"./chunk-IRDH7CN2.js";import{a as n}from"./chunk-DINNT5P2.js";import{a as i,b as r,f as l}from"./chunk-4OT5AMS5.js";import{c as t}from"./chunk-VO7C5OZC.js";var h=i`:host{display:contents}.trigger{display:var(--bl-tooltip-trigger-display, inline-flex);cursor:pointer}bl-popover{--bl-popover-background-color:var(--bl-color-neutral-darker);--bl-popover-arrow-display:block;--bl-popover-border-size:0px;--bl-popover-max-width:424px}.content{color:var(--bl-color-neutral-full)}`,m=h;var e=class extends l{constructor(){super(...arguments);this.placement="top"}static get styles(){return[m]}show(){this.popover.target=this.trigger,this.popover.show(),this.onShow("")}hide(){this.popover.hide(),this.onHide("")}get visible(){return this.popover.visible}triggerTemplate(){return r`<slot class="trigger" name="tooltip-trigger" aria-describedby="tooltip" @focus=${{handleEvent:()=>this.show(),capture:!0}} @blur=${{handleEvent:()=>this.hide(),capture:!0}} @mouseover=${()=>this.show()} @mouseleave=${()=>this.hide()} > </slot>`}render(){return r` ${this.triggerTemplate()} <bl-popover .target="${this.trigger}" placement="${n(this.placement)}" @bl-popover-hide="${()=>this.onHide("")}" > <slot class="content" id="tooltip" role="tooltip"></slot> </bl-popover> `}};t([o(".trigger")],e.prototype,"trigger",2),t([o("bl-popover")],e.prototype,"popover",2),t([a({type:String})],e.prototype,"placement",2),t([p("bl-tooltip-show")],e.prototype,"onShow",2),t([p("bl-tooltip-hide")],e.prototype,"onHide",2),e=t([s("bl-tooltip")],e);export{e as a}; //# sourceMappingURL=chunk-VGRVU3IL.js.map