import{__decorate as t}from"tslib";import{html as e}from"lit";import{property as i,customElement as s}from"lit/decorators.js";import{s as n}from"./nile-inline-edit.css.esm.js";import{N as o}from"../internal/nile-element.esm.js";import{h as l,a as r,u as a,g as c}from"./nile-inline-edit-utils.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 h=class extends o{constructor(){super(...arguments),this.label="",this.placeholder="",this.open=!1,this.value="",this.maxPlaceholderLength=25,this.autoClose=!1,this.disabled=!1,this.handleDocumentFocusInWrapper=t=>{const e=l(t,this,this.open);this.handleCloseResult(e)},this.handleDocumentMouseDownWrapper=t=>{const e=r(t,this,this.open);this.handleCloseResult(e)}}static get styles(){return[n]}handleCloseResult(t){t.shouldClose&&(null!==t.newValue&&(this.value=t.newValue),this.open=!1)}connectedCallback(){super.connectedCallback()}updated(t){super.updated(t),t.has("open")&&this.autoClose&&(this.open?(a(this.updateComplete,this.shadowRoot,this.value),document.addEventListener("focusin",this.handleDocumentFocusInWrapper,!0),document.addEventListener("mousedown",this.handleDocumentMouseDownWrapper,!0)):(document.removeEventListener("focusin",this.handleDocumentFocusInWrapper,!0),document.removeEventListener("mousedown",this.handleDocumentMouseDownWrapper,!0)))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("focusin",this.handleDocumentFocusInWrapper,!0),document.removeEventListener("mousedown",this.handleDocumentMouseDownWrapper,!0)}handleClick(){this.disabled||(this.open=!0)}render(){const t=(this.autoClose?c(this.value,this.maxPlaceholderLength):this.value)||this.placeholder;return e`
      <div class="inline__edit--label" part="label">${this.label}</div>
      ${this.open?e` <slot class="inline__edit--open--container" part="base"> </slot>`:e` <div class="inline__edit--container" part="container" @click=${this.handleClick}>
            ${t}
          </div>`}
    `}};t([i({type:String,reflect:!0})],h.prototype,"label",void 0),t([i({type:String,reflect:!0})],h.prototype,"placeholder",void 0),t([i({type:Boolean,reflect:!0})],h.prototype,"open",void 0),t([i({type:String,reflect:!0})],h.prototype,"value",void 0),t([i({type:Number,attribute:"max-placeholder-length"})],h.prototype,"maxPlaceholderLength",void 0),t([i({type:Boolean,attribute:"auto-close"})],h.prototype,"autoClose",void 0),t([i({type:Boolean,reflect:!0})],h.prototype,"disabled",void 0),h=t([s("nile-inline-edit")],h);export{h as N};
