import{SlIconButton as t}from"./chunk.LOVM4XL6.js";import{getAnimation as e,setDefaultAnimation as s}from"./chunk.STXFIMXZ.js";import{waitForEvent as i}from"./chunk.B4BZKR24.js";import{animateTo as a,stopAnimations as o}from"./chunk.W5IOVX7A.js";import{LocalizeController as r}from"./chunk.2A3352EO.js";import{HasSlotController as n}from"./chunk.NYIIDP5N.js";import{watch as l}from"./chunk.C7FWPEOY.js";import{alert_styles_default as h}from"./chunk.4GRKCE6W.js";import{ShoelaceElement as c}from"./chunk.Z7XDKKOD.js";import{__decorateClass as p}from"./chunk.6M63UXML.js";import{classMap as d}from"../../../../lit/directives/class-map.js";import{html as m}from"../../../../lit/index.js";import{property as u,query as f}from"../../../../lit/decorators.js";var y=Object.assign(document.createElement("div"),{className:"sl-toast-stack"}),b=class extends c{constructor(){super(...arguments),this.hasSlotController=new n(this,"icon","suffix"),this.localize=new r(this),this.open=!1,this.closable=!1,this.variant="primary",this.duration=1/0}firstUpdated(){this.base.hidden=!this.open}restartAutoHide(){clearTimeout(this.autoHideTimeout),this.open&&this.duration<1/0&&(this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration))}handleCloseClick(){this.hide()}handleMouseMove(){this.restartAutoHide()}async handleOpenChange(){if(this.open){this.emit("sl-show"),this.duration<1/0&&this.restartAutoHide(),await o(this.base),this.base.hidden=!1;const{keyframes:t,options:s}=e(this,"alert.show",{dir:this.localize.dir()});await a(this.base,t,s),this.emit("sl-after-show")}else{this.emit("sl-hide"),clearTimeout(this.autoHideTimeout),await o(this.base);const{keyframes:t,options:s}=e(this,"alert.hide",{dir:this.localize.dir()});await a(this.base,t,s),this.base.hidden=!0,this.emit("sl-after-hide")}}handleDurationChange(){this.restartAutoHide()}async show(){if(!this.open)return this.open=!0,i(this,"sl-after-show")}async hide(){if(this.open)return this.open=!1,i(this,"sl-after-hide")}async toast(){return new Promise((t=>{null===y.parentElement&&document.body.append(y),y.appendChild(this),requestAnimationFrame((()=>{this.clientWidth,this.show()})),this.addEventListener("sl-after-hide",(()=>{y.removeChild(this),t(),null===y.querySelector("sl-alert")&&y.remove()}),{once:!0})}))}render(){return m`
      <div
        part="base"
        class=${d({alert:!0,"alert--open":this.open,"alert--closable":this.closable,"alert--has-icon":this.hasSlotController.test("icon"),"alert--primary":"primary"===this.variant,"alert--success":"success"===this.variant,"alert--neutral":"neutral"===this.variant,"alert--warning":"warning"===this.variant,"alert--danger":"danger"===this.variant})}
        role="alert"
        aria-hidden=${this.open?"false":"true"}
        @mousemove=${this.handleMouseMove}
      >
        <div part="icon" class="alert__icon">
          <slot name="icon"></slot>
        </div>

        <div part="message" class="alert__message" aria-live="polite">
          <slot></slot>
        </div>

        ${this.closable?m`
              <sl-icon-button
                part="close-button"
                exportparts="base:close-button__base"
                class="alert__close-button"
                name="x-lg"
                library="system"
                label=${this.localize.term("close")}
                @click=${this.handleCloseClick}
              ></sl-icon-button>
            `:""}
      </div>
    `}};b.styles=h,b.dependencies={"sl-icon-button":t},p([f('[part~="base"]')],b.prototype,"base",2),p([u({type:Boolean,reflect:!0})],b.prototype,"open",2),p([u({type:Boolean,reflect:!0})],b.prototype,"closable",2),p([u({reflect:!0})],b.prototype,"variant",2),p([u({type:Number})],b.prototype,"duration",2),p([l("open",{waitUntilFirstUpdate:!0})],b.prototype,"handleOpenChange",1),p([l("duration")],b.prototype,"handleDurationChange",1),s("alert.show",{keyframes:[{opacity:0,scale:.8},{opacity:1,scale:1}],options:{duration:250,easing:"ease"}}),s("alert.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.8}],options:{duration:250,easing:"ease"}});export{b as SlAlert};