1"use strict";(self.webpackChunksvk_designsystem=self.webpackChunksvk_designsystem||[]).push([[7100],{67100:function(t,e,i){i.r(e),i.d(e,{SvkTextarea:function(){return a}});class a extends HTMLElement{static observedAttributes=["label","name","placeholder","description","error","required","validate-length","validate-min-length","validate-pattern","size","rows","maxlength","disabled","readonly","valid","invalid","value"];static _instanceCount=1;constructor(){super(),this._textarea=null,this._status=null,this._handleInputBound=this.handleInput.bind(this),this._handleChangeBound=this.handleChange.bind(this),this._uid="svk-textarea-"+a._instanceCount++}get invalid(){return this.hasAttribute("invalid")}set invalid(t){t?(this.setAttribute("invalid",""),this.removeAttribute("valid")):this.removeAttribute("invalid")}get valid(){return this.hasAttribute("valid")}set valid(t){t?(this.setAttribute("valid",""),this.removeAttribute("invalid")):this.removeAttribute("valid")}get value(){return this._textarea?.value??this.getAttribute("value")??""}set value(t){null==t||""===t?this.removeAttribute("value"):this.setAttribute("value",String(t))}connectedCallback(){this.renderAndBind()}disconnectedCallback(){this.unbindEvents()}attributeChangedCallback(t,e,i){if(this.isConnected&&this._textarea&&e!==i)return"invalid"===t?(null!==i&&this.hasAttribute("valid")&&this.removeAttribute("valid"),void this._textarea.classList.toggle("is-error",null!==i)):"valid"===t?(null!==i&&this.hasAttribute("invalid")&&this.removeAttribute("invalid"),void this._textarea.classList.toggle("is-valid",null!==i)):"value"===t?(this._textarea.value=i??"",void this.updateStatus()):void this.renderAndBind()}handleInput(t){this.updateStatus()}handleChange(t){this.value=t.target.value,this.emit()}emit(){const t=this.getAttribute("name")??"",e=this.getAttribute("label")??"";this.dispatchEvent(new CustomEvent("svk-change",{bubbles:!0,detail:{value:this.value,name:t,label:e}}))}bindEvents(){this._textarea&&(this._textarea.addEventListener("input",this._handleInputBound),this._textarea.addEventListener("change",this._handleChangeBound))}unbindEvents(){this._textarea&&(this._textarea.removeEventListener("input",this._handleInputBound),this._textarea.removeEventListener("change",this._handleChangeBound))}renderAndBind(){this.unbindEvents(),this.render(),this._textarea=this.querySelector(".textarea__input"),this._status=this.querySelector(".textarea__maxlength"),this.bindEvents(),this._textarea&&(this._textarea.value=this.getAttribute("value")??"",this._textarea.classList.toggle("is-error",this.invalid),this._textarea.classList.toggle("is-valid",this.valid),this.updateStatus())}getValidationAttributes(t,e,i){const a=[];return t&&a.push(`data-pattern="${t}"`),e&&a.push(`data-min-length="${e}"`),i&&a.push(`data-length="${i}"`),a.join(" ")}updateStatus(){if(!this._textarea||!this._status)return;const t=this.getAttribute("maxlength"),e=Number.parseInt(t??"",10);if(!Number.isInteger(e)||e<=0)return this._status.hidden=!0,void(this._status.textContent="");const i=Math.max(0,e-this._textarea.value.length),a=i<=Math.ceil(.2*e);this._status.hidden=!a,this._status.textContent=a?`${i} tecken kvar`:""}render(){const t=this.getAttribute("label")??"",e=this.hasAttribute("required"),i=this.getAttribute("name")??"",a=this.getAttribute("placeholder"),s=this.getAttribute("description"),n=this.getAttribute("validate-length"),r=this.getAttribute("validate-min-length"),l=this.getAttribute("validate-pattern"),h=this.getAttribute("error"),d=this.getAttribute("size")??"100",u=this.getAttribute("rows")??5,v=this.getAttribute("maxlength"),b=this.getAttribute("value")??"",o=this.hasAttribute("disabled"),g=this.hasAttribute("readonly"),c=this.getValidationAttributes(l,r,n);let _=document.createElement("template");_.innerHTML=`\n\t\t\t<label class="textarea__container label-${d}">\n\t\t\t\t<span class="textarea__label">\n\t\t\t\t\t${t}\n\t\t\t\t\t${e?' <abbr title="Obligatoriskt">*</abbr>':""}\n\t\t\t\t</span>\n\t\t\t\t<textarea\n\t\t\t\t\tclass="textarea__input"\n\t\t\t\t\trows="${u}"\n\t\t\t\t\t${this.id?`id="${this.id}"`:`id="${this._uid}"`}\n\t\t\t\t\t${a?`placeholder="${a}"`:""}\n\t\t\t\t\t${e?"required":""}\n\t\t\t\t\t${v?`maxlength="${v}"`:""}\n\t\t\t\t\t${o?"disabled":""}\n\t\t\t\t\t${g?"readonly":""}\n\t\t\t\t\t${c}\n\t\t\t\t\tname="${i}"\n\t\t\t\t\tdata-matomo-mask=""\n\t\t\t\t\tdata-matomo-name="${t}"\n\t\t\t\t>${b}</textarea>\n\t\t\t\t${s||v?`<div class="textarea__status">\n\t\t\t\t\t\t${s?`<span class="textarea__description label-50">${s}</span>`:""}\n\t\t\t\t\t\t${v?'<span class="textarea__maxlength label-50" hidden></span>':""}\n\t\t\t\t\t</div>`:""}\n\t\t\t\t${h?`<span class="textarea__error label-50">${h}</span>`:""}\n\t\t\t</label>\n\t\t`,this.replaceChildren(_.content)}}window.customElements.define("svk-textarea",a)}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.