import{__decorate as t}from"tslib";import{html as e}from"lit";import{query as i,state as s,property as a,customElement as r}from"lit/decorators.js";import{s as o}from"./nile-textarea.css.esm.js";import{classMap as l}from"lit/directives/class-map.js";import{d as h}from"../internal/default-value.esm.js";import{H as n}from"../internal/slot.esm.js";import{ifDefined as d}from"lit/directives/if-defined.js";import{live as c}from"lit/directives/live.js";import{w as m}from"../internal/watch.esm.js";import{N as p}from"../internal/nile-element.esm.js";import{unsafeHTML as u}from"lit/directives/unsafe-html.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 v=class extends p{constructor(){super(...arguments),this.hasSlotController=new n(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="medium",this.filled=!1,this.label="",this.helpText="",this.errorMessage="",this.placeholder="",this.rows=4,this.resize="vertical",this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.warning=!1,this.error=!1,this.success=!1,this.spellcheck=!0,this.defaultValue="",this.fullHeight=!1,this.checkNonPrintableChar=!1,this.hasPrintableCharacters=!1}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver((()=>this.setTextareaHeight())),this.updateComplete.then((()=>{this.setTextareaHeight(),this.resizeObserver.observe(this.input)})),this.fullHeight&&requestAnimationFrame((()=>{let t=this.parentElement?.getBoundingClientRect().height;t&&(t-=65,t<12&&(t=12),this.shadowRoot?.querySelector("textarea")?.style.setProperty("height",`${t}px`))})),this.emit("nile-init")}disconnectedCallback(){super.disconnectedCallback(),this.input&&this.resizeObserver.unobserve(this.input),this.emit("nile-destroy")}handleBlur(){this.hasFocus=!1,this.emit("nile-blur",{value:this.value})}handleChange(){this.value=this.input.value,this.setTextareaHeight(),this.emit("nile-change",{value:this.value})}handleFocus(){this.hasFocus=!0,this.emit("nile-focus",{value:this.value})}handleInput(){this.value=this.input.value,this.emit("nile-input",{value:this.value})}setTextareaHeight(){"auto"===this.resize?(this.input.style.height="auto",this.input.style.height=`${this.input.scrollHeight}px`):this.input.style.height=void 0}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.setTextareaHeight(),this.checkNonPrintableChar&&this.markNonPrintableCharacters()}markNonPrintableCharacters(){let t="";if(this.hasPrintableCharacters=!1,this.value)for(let e=0,i=this.value.length;e<i;e++){const i=this.value.charCodeAt(e);i>255&&9109!==i||[129,143,144,157,160].includes(i)?(t+=`<span class="input__srtiked-text">${this.value.charAt(e)}</span>`,this.hasPrintableCharacters=!0):t+=this.value.charAt(e)}this.markedValue=t,this.emit("nile-value-marked",{value:this.markedValue,hasNonPrintableCharacters:this.hasPrintableCharacters})}removeAllNonPrintableCharacters(){let t="";if(this.value)for(let e=0,i=this.value.length;e<i;e++){const i=this.value.charCodeAt(e);i>255&&9109!==i||[129,143,144,157,160].includes(i)||(t+=this.value.charAt(e))}this.value=t,this.emit("nile-npchar-removed",{value:this.value})}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}scrollPosition(t){return t?("number"==typeof t.top&&(this.input.scrollTop=t.top),void("number"==typeof t.left&&(this.input.scrollLeft=t.left))):{top:this.input.scrollTop,left:this.input.scrollTop}}setSelectionRange(t,e,i="none"){this.input.setSelectionRange(t,e,i)}setRangeText(t,e,i,s){this.input.setRangeText(t,e,i,s),this.value!==this.input.value&&(this.value=this.input.value),this.value!==this.input.value&&(this.value=this.input.value,this.setTextareaHeight())}render(){const t=this.hasSlotController.test("label");this.hasSlotController.test("help-text");const i=!!this.label||!!t,s=!!this.helpText,a=!!this.errorMessage;return e`
      <div
        part="form-control"
        class=${l({"form-control":!0,"form-control--medium":"medium"===this.size,"form-control--has-label":i,"form-control--has-help-text":s})}
      >
        <label
          part="form-control-label"
          class="form-control__label"
          for="input"
          aria-hidden=${i?"false":"true"}
        >
          <slot name="label">${this.label}</slot>
        </label>

        <nile-popup
          ?active=${this.hasPrintableCharacters}
          placement="bottom-start"
          distance="5"
          strategy="fixed"
        >
          <div part="form-control-input" class="form-control-input" slot="anchor">
            <div
              part="base"
              class=${l({textarea:!0,"textarea--medium":"medium"===this.size,"textarea--warning":this.warning,"textarea--error":this.error,"textarea--success":this.success,"textarea--standard":!this.filled,"textarea--disabled":this.disabled,"textarea--focused":this.hasFocus,"textarea--empty":!this.value,"textarea--resize-none":"none"===this.resize,"textarea--resize-vertical":"vertical"===this.resize,"textarea--resize-auto":"auto"===this.resize})}
            >
              <textarea
                part="textarea"
                id="input"
                class="textarea__control"
                title=${this.title}
                name=${d(this.name)}
                .value=${c(this.value)}
                ?disabled=${this.disabled}
                ?readonly=${this.readonly}
                ?required=${this.required}
                placeholder=${d(this.placeholder)}
                rows=${d(this.rows)}
                minlength=${d(this.minlength)}
                maxlength=${d(this.maxlength)}
                autocapitalize=${d(this.autocapitalize)}
                autocorrect=${d(this.autocorrect)}
                ?autofocus=${this.autofocus}
                spellcheck=${d(this.spellcheck)}
                enterkeyhint=${d(this.enterkeyhint)}
                inputmode=${d(this.inputmode)}
                aria-describedby="help-text"
                @change=${this.handleChange}
                @input=${this.handleInput}
                @focus=${this.handleFocus}
                @blur=${this.handleBlur}
              ></textarea>
            </div>

            ${s?e`
                <nile-form-help-text>${this.helpText}</nile-form-help-text>
              `:""}
          ${a?e`
                <nile-form-error-message
                  >${this.errorMessage}</nile-form-error-message
                >
              `:""}

          </div>
          <div class="input__non-printable">
            Non-printable character detected.
            <nile-badge
              variant="error"
              @click=${this.removeAllNonPrintableCharacters}
              class="input__remove-non-printable"
            >
              Remove All
            </nile-badge>

            <div class="input__srtiked-text-container">
              ${u(this.markedValue)}
            </div>
          </div>
        </nile-popup>
      </div>
    `}};v.styles=o,t([i(".textarea__control")],v.prototype,"input",void 0),t([s()],v.prototype,"hasFocus",void 0),t([a()],v.prototype,"title",void 0),t([a()],v.prototype,"name",void 0),t([a()],v.prototype,"value",void 0),t([a({reflect:!0})],v.prototype,"size",void 0),t([a({type:Boolean,reflect:!0})],v.prototype,"filled",void 0),t([a()],v.prototype,"label",void 0),t([a({attribute:"help-text",reflect:!0})],v.prototype,"helpText",void 0),t([a({attribute:"error-message",reflect:!0})],v.prototype,"errorMessage",void 0),t([a()],v.prototype,"placeholder",void 0),t([a({type:Number})],v.prototype,"rows",void 0),t([a()],v.prototype,"resize",void 0),t([a({type:Boolean,reflect:!0})],v.prototype,"disabled",void 0),t([a({type:Boolean,reflect:!0})],v.prototype,"readonly",void 0),t([a({reflect:!0})],v.prototype,"form",void 0),t([a({type:Boolean,reflect:!0})],v.prototype,"required",void 0),t([a({type:Number})],v.prototype,"minlength",void 0),t([a({type:Number})],v.prototype,"maxlength",void 0),t([a({type:Boolean})],v.prototype,"warning",void 0),t([a({type:Boolean})],v.prototype,"error",void 0),t([a({type:Boolean})],v.prototype,"success",void 0),t([a()],v.prototype,"autocapitalize",void 0),t([a()],v.prototype,"autocorrect",void 0),t([a()],v.prototype,"autocomplete",void 0),t([a({type:Boolean})],v.prototype,"autofocus",void 0),t([a()],v.prototype,"enterkeyhint",void 0),t([a({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],v.prototype,"spellcheck",void 0),t([a()],v.prototype,"inputmode",void 0),t([h()],v.prototype,"defaultValue",void 0),t([a({type:Boolean,reflect:!0})],v.prototype,"fullHeight",void 0),t([a({type:Boolean})],v.prototype,"checkNonPrintableChar",void 0),t([s()],v.prototype,"hasPrintableCharacters",void 0),t([s()],v.prototype,"markedValue",void 0),t([m("rows",{waitUntilFirstUpdate:!0})],v.prototype,"handleRowsChange",null),t([m("value",{waitUntilFirstUpdate:!0})],v.prototype,"handleValueChange",null),v=t([r("nile-textarea")],v);export{v as N};
