@postnord/web-components/postnord-web-components/p-83084e67.entry.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{r as e,g as t,h as a,a as r}from"./p-C247oTEA.js";import{uuidv4 as n}from"./index.esm.js";const o='pn-textarea{display:inline-flex;flex-direction:column}pn-textarea .pn-textarea-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-textarea .pn-textarea-label{transition-duration:0s;transition-delay:0s}}pn-textarea .pn-textarea-label>span{font-size:0.875em}pn-textarea .pn-textarea-text{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}pn-textarea .pn-textarea-text>pn-icon{margin-right:0.25em}pn-textarea .pn-textarea-element{color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}pn-textarea .pn-textarea-element:-webkit-autofill,pn-textarea .pn-textarea-element:-webkit-autofill:hover,pn-textarea .pn-textarea-element:-webkit-autofill:focus,pn-textarea .pn-textarea-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}pn-textarea .pn-textarea-element{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-textarea .pn-textarea-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}pn-textarea .pn-textarea-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-textarea .pn-textarea-element{transition-duration:0s;transition-delay:0s}}pn-textarea .pn-textarea-element::placeholder{color:#5e554a;font-weight:normal}pn-textarea .pn-textarea-element:hover{border-color:#005d92}pn-textarea .pn-textarea-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}pn-textarea .pn-textarea-element::-webkit-scrollbar{background-color:#ffffff;width:0.875em;border-radius:0.5em}pn-textarea .pn-textarea-element::-webkit-scrollbar-track{background-color:#ffffff;border-radius:0.5em}pn-textarea .pn-textarea-element::-webkit-scrollbar-thumb{cursor:pointer;background-color:#969087;border-radius:1em;border:0.25em solid #ffffff}pn-textarea .pn-textarea-element::-webkit-scrollbar-thumb:hover{background-color:#5e554a}pn-textarea .pn-textarea-element::-webkit-scrollbar-corner,pn-textarea .pn-textarea-element::-webkit-scrollbar-button{display:none}pn-textarea .pn-textarea-element{width:100%;resize:none}pn-textarea .pn-textarea-element:read-only{border-color:#ffffff}pn-textarea .pn-textarea-element::-webkit-resizer{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%0A%20%20%3Cpath%20d%3D%22M7%2017L17%207M12%2017L17%2012%22%20stroke%3D%22%23005D92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center}pn-textarea .pn-textarea[data-valid]>.pn-textarea-label{color:#005e41}pn-textarea .pn-textarea[data-valid]>.pn-textarea-element{border-color:#005e41}pn-textarea .pn-textarea[data-valid]>.pn-textarea-element:hover{border-color:#002f24}pn-textarea .pn-textarea[data-valid]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#005e41;outline-color:#005e41}pn-textarea .pn-textarea[data-error]>.pn-textarea-label{color:#a70707}pn-textarea .pn-textarea[data-error]>.pn-textarea-element{border-color:#a70707}pn-textarea .pn-textarea[data-error]>.pn-textarea-element:hover{border-color:#500715}pn-textarea .pn-textarea[data-error]>.pn-textarea-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}pn-textarea .pn-textarea[data-error]>.pn-textarea-text[role=alert]{color:#a70707}pn-textarea .pn-textarea[data-resize]>.pn-textarea-element{resize:vertical}';const i=class{constructor(t){e(this,t)}id=`pn-textarea-${n()}`;idHelper=`${this.id}-text`;get hostElement(){return t(this)}content;label;value="";helpertext;textareaid=this.id;name;form;rows=2;cols=20;wrap="soft";maxlength;autocomplete="off";spellcheck=false;placeholder;resize=false;required=false;valid=false;invalid=false;error;disabled=false;readonly=false;componentWillLoad(){if(this.textareaid!==this.id){this.idHelper=`${this.textareaid}-helper`}}setVal(e){const t=e.target.value;this.value=t}hasError(){return this.invalid||!!this.error}hasMessage(){return!!(this.helpertext?.length||this.error?.length)}render(){return a(r,{key:"77b98a5ebb9daa07ad2c1a139759ff6a03648214"},a("div",{key:"44147c7e0670136f490a8bd1bfd0528eedbbfe95",class:"pn-textarea","data-valid":this.valid,"data-error":this.hasError(),"data-resize":this.resize},a("label",{key:"f4a3aa2ef958699771705a0f67510d8261934ec5",class:"pn-textarea-label",htmlFor:this.textareaid},a("span",{key:"616a2680cad60cda844122070291dc567d1480fd"},this.label),this.maxlength>=1&&a("span",{key:"3a7e01fc079625b8f34555438f800c908fb5e140"},`${this.value?.length||0}/${this.maxlength}`)),a("textarea",{key:"21c805f8b98300af18855757042b7fcd79437809",class:"pn-textarea-element",id:this.textareaid,name:this.name,rows:this.rows,cols:this.cols,wrap:this.wrap,autocomplete:this.autocomplete,spellcheck:this.spellcheck,placeholder:this.placeholder,maxlength:this.maxlength,required:this.required,disabled:this.disabled,readonly:this.readonly,"aria-describedby":this.hasMessage()?this.idHelper:null,"aria-invalid":this.hasError().toString(),onInput:e=>this.setVal(e),value:this.value}),this.hasMessage()&&a("p",{key:"c895fc6c93fffba4367dcf5b8e774a72dae98c7e",id:this.idHelper,class:"pn-textarea-text",role:this.error?.length?"alert":null},a("span",{key:"f727cb52600c77b3c1ede33b1fa3a26817b9baad"},this.error||this.helpertext))))}};i.style=o;export{i as pn_textarea};
//# sourceMappingURL=p-83084e67.entry.js.map