nve-designsystem 0.1.62 → 0.1.63

package/components/nve-textarea/nve-textarea.component.d.ts

@@ -64,6 +64,13 @@ export default class NveTextarea extends LitElement {
      * tastaturet på støttede enheter.
      */
     inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+    /** Antall rader med tekst i textarea-taggen.
+     * Browser-default dersom denne ikke er satt er 2 i alle browsere
+     *
+     * Bestemmer initiell høyde på textarea-boksen
+     * (settes slik at antall rader * font-høyde får plass)
+     */
+    rows?: number;
     /** Bestemmer om feilmelding skal vises når validering feiler  */
     private showErrorMessage;
     /** Om bruker starter å skrive noe i textarea */

package/components/nve-textarea/nve-textarea.component.js

@@ -1,9 +1,9 @@
-import { s as c, x as o } from "../../chunks/lit-element.js";
+import { s as c, x as l } from "../../chunks/lit-element.js";
 import { n as r, t as m } from "../../chunks/property.js";
 import { r as u } from "../../chunks/state.js";
 import { e as b } from "../../chunks/query.js";
 import v from "./nve-textarea.styles.js";
-import { o as l } from "../../chunks/if-defined.js";
+import { o } from "../../chunks/if-defined.js";
 import { l as f } from "../../chunks/live.js";
 import { e as g } from "../../chunks/class-map.js";
 import "../nve-icon/nve-icon.component.js";
@@ -84,37 +84,38 @@ let t = class extends c {
     this.toggleAttribute("data-valid", e), this.toggleAttribute("data-user-valid", e), this.toggleAttribute("data-invalid", !e), this.toggleAttribute("data-user-invalid", !e);
   }
   render() {
-    return o`
+    return l`
       <div part="form-control" class=${g({ "form-control": !0, "form-control--has-label": this.label })}>
         <div part="textarea-label" class="textarea__label">
-          ${this.label ? o`
+          ${this.label ? l`
                 <nve-label
                   for="input"
                   aria-hidden=${this.label ? "false" : "true"}
                   value=${this.label}
-                  tooltip=${l(this.tooltip)}
+                  tooltip=${o(this.tooltip)}
                 ></nve-label>
               ` : null}
-          ${this.required && this.label ? o`<span class="textarea__required-label">${this.requiredLabel}</span>` : null}
+          ${this.required && this.label ? l`<span class="textarea__required-label">${this.requiredLabel}</span>` : null}
         </div>
         <div part="base" class="textarea__base">
           <textarea
             part="textarea"
             class="textarea__control"
             title=${this.title}
-            name=${l(this.name)}
+            name=${o(this.name)}
             .value=${f(this.value)}
             ?disabled=${this.disabled}
             ?readonly=${this.readonly}
             ?required=${this.required}
-            placeholder=${l(this.placeholder)}
-            minlength=${l(this.minlength)}
-            maxlength=${l(this.maxlength)}
-            autocapitalize=${l(this.autocapitalize)}
-            autocorrect=${l(this.autocorrect)}
+            placeholder=${o(this.placeholder)}
+            minlength=${o(this.minlength)}
+            maxlength=${o(this.maxlength)}
+            autocapitalize=${o(this.autocapitalize)}
+            autocorrect=${o(this.autocorrect)}
             ?autofocus=${this.autofocus}
-            inputmode=${l(this.inputmode)}
+            inputmode=${o(this.inputmode)}
             aria-describedby="help-text"
+            rows=${o(this.rows)}
             @change=${this.handleChange}
             @input=${this.handleInput}
             @blur=${this.handleBlur}
@@ -124,17 +125,17 @@ let t = class extends c {
           Må gjøres sånn fordi vi vil ikke begrense textarea__base brede til fit-content (da textarea kan aldri ta så mye plass som er 
           tilgjengelig i nettleseren og man må alltid sette brede på den manuelt. Nei takk.) -->
           <!-- Foreløpig kan man ha enten 'lock' eller 'error' ikone -->
-          ${this.disabled || this.showErrorMessage ? o`<div class="textarea__icon__container">
-                ${this.disabled ? o`<nve-icon name="lock"></nve-icon>` : null}
-                ${this.showErrorMessage ? o`<nve-icon class="textarea__icon--error" name="error"></nve-icon>` : null}
+          ${this.disabled || this.showErrorMessage ? l`<div class="textarea__icon__container">
+                ${this.disabled ? l`<nve-icon name="lock"></nve-icon>` : null}
+                ${this.showErrorMessage ? l`<nve-icon class="textarea__icon--error" name="error"></nve-icon>` : null}
               </div>` : null}
         </div>
         <div part="help-text-container" class="textarea__help-text__container">
           <!-- Ikke vis hjelpe tekst mens feil -->
-          ${!this.showErrorMessage && this.helpText ? o`<span class="textarea__help-text" aria-hidden=${this.helpText ? "false" : "true"}
+          ${!this.showErrorMessage && this.helpText ? l`<span class="textarea__help-text" aria-hidden=${this.helpText ? "false" : "true"}
                 >${this.helpText}</span
               >` : null}
-          ${this.showErrorMessage ? o`<span class="textarea__help-text textarea__help-text--error">${this.errorMessage}</span>` : null}
+          ${this.showErrorMessage ? l`<span class="textarea__help-text textarea__help-text--error">${this.errorMessage}</span>` : null}
         </div>
       </div>
     `;
@@ -195,6 +196,9 @@ i([
 i([
   r()
 ], t.prototype, "inputmode", 2);
+i([
+  r()
+], t.prototype, "rows", 2);
 i([
   u()
 ], t.prototype, "showErrorMessage", 2);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nve-designsystem",
-  "version": "0.1.62",
+  "version": "0.1.63",
   "exports": {
     ".": {
       "import": "./nve-designsystem.js",