import{__decorate as i}from"tslib";import{html as t}from"lit";import{s as a}from"./nile-accordion.css.esm.js";import{N as e}from"../internal/nile-element.esm.js";import{s,a as r,b as o}from"../internal/animate.esm.js";import{classMap as n}from"lit/directives/class-map.js";import{query as c,property as h,customElement as l}from"lit/decorators.js";import{s as d,g as m}from"../utilities/animation-registry.esm.js";import{w as p}from"../internal/event.esm.js";import{w as f}from"../internal/watch.esm.js";import"../internal/accessibility/a11y.state.enum.esm.js";import"../internal/accessibility/a11y.property.enum.esm.js";import"../internal/accessibility/role.enum.esm.js";let y=class extends e{constructor(){super(...arguments),this.open=!1,this.variant="light",this.expandIconPlacement="right",this.size="md",this.disabled=!1}firstUpdated(){this.body.hidden=!this.open,this.body.style.height=this.open?"auto":"0"}handleSummaryClick(){this.disabled||(this.open?this.hide():this.show(),this.header.focus())}handleSummaryKeyDown(i){"Enter"!==i.key&&" "!==i.key||(i.preventDefault(),this.open?this.hide():this.show()),"ArrowUp"!==i.key&&"ArrowLeft"!==i.key||(i.preventDefault(),this.hide()),"ArrowDown"!==i.key&&"ArrowRight"!==i.key||(i.preventDefault(),this.show())}async handleOpenChange(){if(this.open){if(this.emit("nile-show",{cancelable:!0}).defaultPrevented)return void(this.open=!1);await s(this.body),this.body.hidden=!1;const{keyframes:i,options:t}=m(this,"accordian.show",{dir:"ltr"});await r(this.body,o(i,this.body.scrollHeight),t),this.body.style.height="auto",this.emit("nile-after-show")}else{if(this.emit("nile-hide",{cancelable:!0}).defaultPrevented)return void(this.open=!0);await s(this.body);const{keyframes:i,options:t}=m(this,"accordian.hide",{dir:"ltr"});await r(this.body,o(i,this.body.scrollHeight),t),this.body.hidden=!0,this.body.style.height="auto",this.emit("nile-after-hide")}}async show(){if(!this.open&&!this.disabled)return this.open=!0,p(this,"nile-after-show")}async hide(){if(this.open&&!this.disabled)return this.open=!1,p(this,"nile-after-hide")}render(){return t`
    <div
      part="base"
      class=${n({accordian:!0,"accordian--open":this.open,"accordian--disabled":this.disabled,"accordian--sm":"sm"==this.size,"accordian--md":"md"==this.size,"accordian--lg":"lg"==this.size})}
    >
      <div
        part="header"
        id="header"
        class="${n({accordian__header:!0,"accordian__header--dark":"dark"==this.variant,"accordian__header--arrow-left":"left"==this.expandIconPlacement})}"
        role="button"
        aria-expanded=${this.open?"true":"false"}
        aria-controls="content"
        aria-disabled=${this.disabled?"true":"false"}
        tabindex=${this.disabled?"-1":"0"}
        @click=${this.handleSummaryClick}
        @keydown=${this.handleSummaryKeyDown}
      >
        <slot name="summary" part="summary" class="accordian__summary">${this.summary}</slot>

        <span part="summary-icon" class="accordian__summary-icon">
          <slot name="expand-icon">
            <nile-icon name="var(--nile-icon-arrow-right, var(--ng-icon-chevron-right))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" library="system"></nile-icon>
          </slot>
          <slot name="collapse-icon">
            <nile-icon name="var(--nile-icon-arrow-right, var(--ng-icon-chevron-right))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" library="system"></nile-icon>
          </slot>
        </span>
      </div>

      <div class="accordian__body" role="region" aria-labelledby="header">
        <slot part="content" id="content" 
          class="${n({accordian__content:!0,"accordian__content--arrow-left":"left"==this.expandIconPlacement})}"></slot>
      </div>
    </div>
  `}};y.styles=a,i([c(".accordian")],y.prototype,"accordian",void 0),i([c(".accordian__header")],y.prototype,"header",void 0),i([c(".accordian__body")],y.prototype,"body",void 0),i([c(".accordian__expand-icon-slot")],y.prototype,"expandIconSlot",void 0),i([h({type:Boolean,reflect:!0})],y.prototype,"open",void 0),i([h({reflect:!0})],y.prototype,"variant",void 0),i([h({reflect:!0})],y.prototype,"expandIconPlacement",void 0),i([h({reflect:!0})],y.prototype,"size",void 0),i([h()],y.prototype,"summary",void 0),i([h({type:Boolean,reflect:!0})],y.prototype,"disabled",void 0),i([f("open",{waitUntilFirstUpdate:!0})],y.prototype,"handleOpenChange",null),y=i([l("nile-accordion")],y),d("accordian.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:250,easing:"linear"}}),d("accordian.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:250,easing:"linear"}});export{y as N};
