@trendyol/baklava
Version:
Trendyol Baklava Design System
21 lines (20 loc) • 1.75 kB
JavaScript
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"
=${{handleEvent:()=>this.show(),capture:!0}}
=${{handleEvent:()=>this.hide(),capture:!0}}
=${()=>this.show()}
=${()=>this.hide()}
>
</slot>`}render(){return r`
${this.triggerTemplate()}
<bl-popover
.target="${this.trigger}"
placement="${n(this.placement)}"
-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