import{__decorate as i}from"tslib";import{html as t}from"lit";import{property as s,customElement as e}from"lit/decorators.js";import{classMap as r}from"lit/directives/class-map.js";import{s as n}from"./nile-section-message.css.esm.js";import{N as o}from"../internal/nile-element.esm.js";import{H as a}from"../internal/slot.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 c=class extends o{constructor(){super(...arguments),this.hasSlotController=new a(this,"section__heading","section__description","footer__actions"),this.heading="",this.description="",this.iconSize=16,this.variant="primary",this.iconMap={primary:"var(--nile-icon-info, var(--ng-icon-info-circle))",success:"var(--nile-icon-done-02, var(--ng-icon-check-circle-broken))",warning:"var(--nile-icon-warning, var(--ng-icon-alert-circle))",error:"var(--nile-icon-warning, var(--ng-icon-alert-circle))"}}static get styles(){return[n]}connectedCallback(){super.connectedCallback(),this.updateComplete.then((()=>{this.addActionSeparators()}))}addActionSeparators(){this.shadowRoot?.querySelector('slot[name="footer__actions"]')}render(){const i=this.hasSlotController.test("section__heading")||this.heading,s=this.hasSlotController.test("section__description")||this.description,e=this.hasSlotController.test("footer__actions");return t`
      <div
        part="parent__wrapper"
        class=${r({parent__wrapper:!0,"section--primary":"primary"===this.variant,"section--success":"success"===this.variant,"section--warning":"warning"===this.variant,"section--error":"error"===this.variant})}
      >
        <div
          class=${r({left__wrapper:!0,"icon--primary":"primary"===this.variant,"icon--success":"success"===this.variant,"icon--warning":"warning"===this.variant,"icon--error":"error"===this.variant})}
          part="icon__wrapper"
        >
          <slot name="icon">
            <nile-icon-button
              name="${this.iconMap[this.variant]}"  
              size="${this.iconSize}"
              color="var(--nile-colors-white-base, white)"
            >
            </nile-icon-button>
          </slot>
        </div>
        <div class="right__wrapper" part="content__wrapper">
          ${i?t` <slot name="section__heading" class="section__heading">
                <div part="section__heading">${this.heading}</div>
              </slot>`:null}
          ${s?t` <slot
                name="section__description"
                class="section__description"
              >
                <div part="section__description">${this.description}</div>
              </slot>`:null}
          ${e?t`
                <slot
                  name="footer__actions"
                  part="footer__actions"
                  class="footer__actions"
                ></slot>
              `:""}
        </div>
      </div>
    `}};i([s({type:String,attribute:"heading"})],c.prototype,"heading",void 0),i([s({type:String,attribute:"description"})],c.prototype,"description",void 0),i([s({type:Number,attribute:"icon-size"})],c.prototype,"iconSize",void 0),i([s()],c.prototype,"variant",void 0),c=i([e("nile-section-message")],c);export{c as N};
