text: import Card from'./card.min.js';import Backdrop from'./backdrop.min.js';import Button from'./button.min.js';import Floats from'../utils/float.min.js';import{defineUIComponent,document,global}from'../utils/dom.min.js';import{mix}from'../../../mixwith/src/mixwith.js';const template=document.createElement('template');template.innerHTML=`
    <style>
      :host {
        display: block;
        position: absolute;
        padding: 20px;
        z-index: 10001;
        background-color: #fff;
        overflow: hidden;
      }
  
      :host(.large-dialog) {
        width: 80%;
        height: 80%;
        top: 8%;
        left: 9%;
      }
  
      :host(.small-dialog) {
        width: 250px;
        height: 185px;
        top: calc(50vh - 130px);
        left: calc(50vw - 155px);
      }
  
      :host(.medium-dialog) {
        width: 50%;
        height: 50%;
        top: 20%;
        left: 25%;
      }
  
      :host(.scrollable-dialog) {
        overflow: scroll;
      }
    </style>
  `;const reflectedAttributes=['is-open','is-modal','small-dialog','medium-dialog','large-dialog','scrollable-dialog'],manipulators=new WeakMap,incorporateButtonChild=(a,b)=>{let c=manipulators.get(a);c||(c=[()=>{a.close(),a.dispatchEvent(new CustomEvent('dialog-dismiss'))},()=>{a.close(),a.dispatchEvent(new CustomEvent('dialog-confirm'))}],manipulators.set(a,c));const[d,e]=c;return b.attr('dialog-dismiss')&&b.on('click enter-key',d),b.attr('dialog-confirm')&&b.on('click enter-key',e),b.watchAttribute(b,'dialog-dismiss',(a)=>{a?b.on('click enter-key',d):b.remove(d)}),b.watchAttribute(b,'dialog-confirm',(a)=>{a?b.on('click enter-key',e):b.remove(e)}),a},Dialog=defineUIComponent({name:'ui-dialog',template,reflectedAttributes,definition:class extends Card{constructor(){super(),this._backdrop=null,global.addEventListener('logout',()=>{this.close()})}appendChild(a){return a&&a.onReady&&a.onReady((b)=>{b&&b.matches&&b.matches('.ui-button')?(incorporateButtonChild(this,b),this.shadowRoot.appendChild(b)):super.appendChild(a)}),a}open(){return this.isOpen=!0,this}close(){return this.isOpen=!1,this}init(){super.init(),this.hide(),this.attr('role','dialog'),this._backdrop=document.createElement('ui-backdrop'),this._backdrop.for=this,document.body.appendChild(this._backdrop),this._beforeReady(()=>{[...this.selectInternalAll('.ui-button'),...this.selectAll('.ui-button')].forEach((a)=>incorporateButtonChild(this,a))});const a=()=>{this.close()};this.on('attribute-change',({changed:{now:b,name:c}})=>{switch(c){case'small-dialog':return b?(this.classList.add('small-dialog'),this.classList.remove('medium-dialog','large-dialog')):this.classList.remove('small-dialog');case'medium-dialog':return b?(this.classList.add('medium-dialog'),this.classList.remove('small-dialog','large-dialog')):this.classList.remove('medium-dialog');case'large-dialog':return b?(this.classList.add('large-dialog'),this.classList.remove('small-dialog','medium-dialog')):this.classList.remove('large-dialog');case'scrollable-dialog':return b?this.classList.add('scrollable-dialog'):this.classList.remove('scrollable-dialog');case'is-modal':return b?this._backdrop.on('click',a):this._backdrop.remove(a);case'is-open':b?(this.isModal&&this._backdrop.show(),this.classList.add('is-opened'),this.show(),this.dispatchEvent(new CustomEvent('dialog-opened'))):(this.classList.remove('is-opened'),this._backdrop.hide(),this.hide(),this.dispatchEvent(new CustomEvent('dialog-closed')));}})}}});export default Dialog;