@sandlada/mdc/build/components/tooltip/tooltip.js

@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.

import{customElement as e}from"../../node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as t}from"../../node_modules/@lit/reactive-element/decorators/property.js";import{state as n}from"../../node_modules/@lit/reactive-element/decorators/state.js";import{query as r}from"../../node_modules/@lit/reactive-element/decorators/query.js";import"../../node_modules/lit/decorators.js";import{html as i}from"../../node_modules/lit-html/lit-html.js";import{LitElement as a}from"../../node_modules/lit-element/lit-element.js";import"../../node_modules/lit/index.js";import{classMap as o}from"../../node_modules/lit-html/directives/class-map.js";import"../../node_modules/lit/directives/class-map.js";import{composeMixin as s}from"../../utils/compose-mixin/compose-mixin.js";import c from"../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorate.js";import{mixinDelegatesAria as l}from"../../utils/aria/delegate.js";import{TOOLTIP_HIDDEN_EVENT as u,TOOLTIP_HIDING_EVENT as d,TOOLTIP_SHOWING_EVENT as f,TOOLTIP_SHOWN_EVENT as p}from"./tooltip.interface.js";import{TooltipStyles as m}from"./tooltip.style.js";
/**
* @license
* Copyright 2026 Kai-Orion & Sandlada
* SPDX-License-Identifier: MIT
*/
let h=class extends s(l)(a){static{this.styles=m}constructor(){super(),this.position=`top`,this.open=!1,this.rich=!1,this.plain=!1,this.hasContent=!1,this.hasActions=!1}connectedCallback(){super.connectedCallback(),this.detectRichMode()}willUpdate(e){e.has(`open`)&&(this.open?this.handleOpen():e.get(`open`)===!0&&this.handleClose())}getRenderClasses(){return{container:!0,"has-content":this.hasContent,"has-actions":this.hasActions,"has-headline":this.hasHeadline()}}render(){return i`<div class="${o(this.getRenderClasses())}" role="tooltip">${this.renderHeadline()} ${this.renderContent()} ${this.renderActions()}</div>`}renderHeadline(){return this.rich?i`<div class="headline"><slot name="headline"></slot></div>`:i``}renderContent(){return i`<div class="content"><slot @slotchange="${this.handleContentSlotChange}"></slot></div>`}renderActions(){return this.rich?i`<div class="actions"><slot name="actions" @slotchange="${this.handleActionsSlotChange}"></slot></div>`:i``}async show(){this.open||=!0}async hide(){this.open&&=!1}detectRichMode(){let e=this.querySelector(`[slot="headline"]`),t=this.querySelector(`[slot="actions"]`);e||t?(this.rich=!0,this.plain=!1):(this.rich=!1,this.plain=!0)}hasHeadline(){return this.querySelector(`[slot="headline"]`)!==null}handleOpen(){this.dispatchEvent(new Event(f,{bubbles:!0,composed:!0})),setTimeout(()=>{this.dispatchEvent(new Event(p,{bubbles:!0,composed:!0}))},200)}handleClose(){this.containerElement?.classList.add(`hiding`),this.dispatchEvent(new Event(d,{bubbles:!0,composed:!0})),setTimeout(()=>{this.containerElement?.classList.remove(`hiding`),this.dispatchEvent(new Event(u,{bubbles:!0,composed:!0}))},200)}handleContentSlotChange(e){let t=e.target;this.hasContent=t.assignedElements().length>0}handleActionsSlotChange(e){let t=e.target;this.hasActions=t.assignedElements().length>0}};c([t({type:String,reflect:!0})],h.prototype,`position`,void 0),c([t({type:Boolean,reflect:!0})],h.prototype,`open`,void 0),c([t({type:Boolean,reflect:!0})],h.prototype,`rich`,void 0),c([t({type:Boolean,reflect:!0})],h.prototype,`plain`,void 0),c([n()],h.prototype,`hasContent`,void 0),c([n()],h.prototype,`hasActions`,void 0),c([r(`.container`)],h.prototype,`containerElement`,void 0),h=c([e(`mdc-tooltip`)],h);export{h as MDCTooltip};
//# sourceMappingURL=tooltip.js.map