@oslokommune/punkt-elements 12.18.6 → 12.18.8

package/dist/{datepicker-D5Dsxvio.cjs → datepicker-jrTEwP30.cjs}

@@ -1,4 +1,4 @@
-"use strict";const $=require("./class-map-Boa7BqCc.cjs"),k=require("./if-defined-DEDlGbAc.cjs"),s=require("./icon-CdMQ6zBT.cjs"),T=require("./state-SKYD8kRO.cjs"),g=require("./calendar-QSulz7im.cjs"),S=require("./input-element-BxMdqhqV.cjs"),r=require("./ref-DCOsLZQg.cjs");require("./input-wrapper-D-PNRJB_.cjs");require("./tag-CGy2mSLE.cjs");/**
+"use strict";const $=require("./class-map-Boa7BqCc.cjs"),k=require("./if-defined-DEDlGbAc.cjs"),s=require("./icon-CdMQ6zBT.cjs"),T=require("./state-SKYD8kRO.cjs"),g=require("./calendar-QSulz7im.cjs"),S=require("./input-element-BxMdqhqV.cjs"),r=require("./ref-DCOsLZQg.cjs");require("./input-wrapper-CE_6pjX_.cjs");require("./tag-CGy2mSLE.cjs");/**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause

package/dist/{datepicker-BrAEkscZ.js → datepicker-ub8Sf0Ol.js}

@@ -5,7 +5,7 @@ import { r as V } from "./state-BfyXV7EL.js";
 import { n as D, f as _, a as N, b as E, d as A } from "./calendar-BUqcNvfI.js";
 import { P as U } from "./input-element--t-9j6bw.js";
 import { p as K, v as y, r as w, M as I, m as W, e as R, n as $ } from "./ref-DuFGTLVX.js";
-import "./input-wrapper-BTQk3W8T.js";
+import "./input-wrapper-YQW5Ab0s.js";
 import "./tag-DGFgUF3l.js";
 /**
  * @license

package/dist/index.d.ts

@@ -392,6 +392,7 @@ export declare class PktInputWrapper extends PktElement {
     hasFieldset: boolean;
     useWrapper: boolean;
     render(): TemplateResult<1>;
+    private toggleDropdown;
 }
 
 export declare class PktLink extends PktElement {

package/dist/input-wrapper-CE_6pjX_.cjs

@@ -0,0 +1,47 @@
+"use strict";const t=require("./icon-CdMQ6zBT.cjs"),f=require("./pkt-slot-controller-Ckk_yV0j.cjs"),d=require("./ref-DCOsLZQg.cjs"),l=require("./class-map-Boa7BqCc.cjs"),$=require("./stringutils-CkVRq4jP.cjs"),r=require("./helptext-iZEgxz2U.cjs");var I=Object.defineProperty,w=Object.getOwnPropertyDescriptor,e=(u,s,a,o)=>{for(var p=o>1?void 0:o?w(s,a):s,i=u.length-1,n;i>=0;i--)(n=u[i])&&(p=(o?n(s,a,p):n(p))||p);return o&&p&&I(s,a,p),p};exports.PktInputWrapper=class extends t.PktElement{constructor(){super(),this.defaultSlot=d.e(),this.forId=$.uuidish(),this.label="",this.helptext="",this.helptextDropdown="",this.helptextDropdownButton=r.specs.props.helptextDropdownButton.default,this.counter=r.specs.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.optionalTag=r.specs.props.optionalTag.default,this.optionalText=r.specs.props.optionalText.default,this.requiredTag=r.specs.props.requiredTag.default,this.requiredText=r.specs.props.requiredText.default,this.hasError=r.specs.props.hasError.default,this.errorMessage="",this.disabled=r.specs.props.disabled.default,this.inline=r.specs.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=r.specs.props.hasFieldset.default,this.useWrapper=r.specs.props.useWrapper.default,this.slotController=new f.PktSlotController(this,this.defaultSlot)}render(){const s={"pkt-inputwrapper":!0,"pkt-inputwrapper--error":this.hasError,"pkt-inputwrapper--disabled":this.disabled,"pkt-inputwrapper--inline":this.inline},a={"pkt-tag":!0,"pkt-tag--small":!0,"pkt-tag--thin-text":!0,"pkt-tag--blue-light":this.optionalTag,"pkt-tag--beige":!this.optionalTag&&this.requiredTag},o=this.helptextDropdown!=="",p={"pkt-inputwrapper__label":!0,"pkt-inputwrapper__fieldset":this.hasFieldset,"pkt-inputwrapper__legend":this.hasFieldset},i=this.ariaDescribedby?this.ariaDescribedby:this.helptext?`${this.forId}-helptext`:t.E,n=()=>this.optionalTag||this.requiredTag?t.x`<span class=${l.e(a)}
+          >${this.optionalTag?this.optionalText:this.requiredTag?this.requiredText:t.E}</span
+        >`:t.E,c=()=>this.useWrapper?this.hasFieldset?t.x`<legend class="pkt-inputwrapper__legend" id="${this.forId}-label">
+            ${this.label} ${n()}
+          </legend>`:o?t.x`<h2>${this.label} ${n()}</h2>`:t.x`<span>${this.label} ${n()}</span>`:t.x`<label
+          for="${this.forId}"
+          class="pkt-sr-only"
+          aria-describedby="${i}"
+          id="${this.forId}-label"
+        >
+          ${this.label}
+        </label>`,x=()=>this.useWrapper&&(this.helptext||this.helptextDropdown)?t.x`
+          <pkt-helptext
+            .forId=${this.forId}
+            .helptext=${this.helptext}
+            .helptextDropdown=${this.helptextDropdown}
+            .helptextDropdownButton=${this.helptextDropdownButton||r.specs.props.helptextDropdownButton.default}
+            @toggleHelpText=${k=>{this.toggleDropdown(k)}}
+          ></pkt-helptext>
+        `:t.E,g=()=>this.counter?t.x`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
+          ${this.counterCurrent||0}
+          ${this.counterMaxLength?`/${this.counterMaxLength}`:t.E}
+        </div>`:t.E,b=()=>this.hasError&&this.errorMessage?t.x`<div
+          class="pkt-alert pkt-alert--error pkt-alert--compact"
+          aria-live="assertive"
+          aria-atomic="true"
+          id="${this.forId}-error"
+        >
+          <pkt-icon name="alert-error" class="pkt-alert__icon"></pkt-icon>
+          <div class="pkt-alert__text">${t.o(this.errorMessage)}</div>
+        </div>`:t.E,h=()=>t.x`
+        ${c()} ${x()}
+        ${o?t.x`<label for="${this.forId}" class="pkt-sr-only" aria-describedby="${i}"
+              >${this.label}</label
+            >`:t.E}
+        <div class="pkt-contents" ${d.n(this.defaultSlot)}></div>
+        ${g()} ${b()}
+      `,y=()=>this.hasFieldset?t.x`<fieldset class=${l.e(p)} aria-describedby="${i}">
+            ${h()}
+          </fieldset>`:o?t.x`<div class=${l.e(p)}>${h()}</div>`:t.x`<label
+              class=${l.e(p)}
+              for="${this.forId}"
+              aria-describedby="${i}"
+              id="${this.forId}-label"
+            >
+              ${h()}
+            </label>`;return t.x`<div class=${l.e(s)}>${y()}</div> `}toggleDropdown(s){this.dispatchEvent(new CustomEvent("toggleHelpText",{bubbles:!1,detail:{isOpen:s.detail.isOpen}}))}};e([t.n({type:String})],exports.PktInputWrapper.prototype,"forId",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"label",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptext",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptextDropdown",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptextDropdownButton",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"counter",2);e([t.n({type:Number})],exports.PktInputWrapper.prototype,"counterCurrent",2);e([t.n({type:Number})],exports.PktInputWrapper.prototype,"counterMaxLength",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"optionalTag",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"optionalText",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"requiredTag",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"requiredText",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"hasError",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"errorMessage",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"disabled",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"inline",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"ariaDescribedby",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"hasFieldset",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"useWrapper",2);exports.PktInputWrapper=e([t.t("pkt-input-wrapper")],exports.PktInputWrapper);

package/dist/{input-wrapper-BTQk3W8T.js → input-wrapper-YQW5Ab0s.js}

@@ -1,81 +1,92 @@
-import { P as x, E as a, x as p, n as r, t as w, o as m } from "./icon-wUXeHiBk.js";
-import { P as k } from "./pkt-slot-controller-RJvOnbF4.js";
-import { e as v, n as T } from "./ref-DuFGTLVX.js";
-import { e as u } from "./class-map-hz16xq5a.js";
+import { P as w, E as l, x as p, n as r, t as m, o as k } from "./icon-wUXeHiBk.js";
+import { P as v } from "./pkt-slot-controller-RJvOnbF4.js";
+import { e as T, n as D } from "./ref-DuFGTLVX.js";
+import { e as c } from "./class-map-hz16xq5a.js";
 import { u as _ } from "./stringutils-DJjRa8dG.js";
 import { s as o } from "./helptext--4FLdAWi.js";
-var D = Object.defineProperty, B = Object.getOwnPropertyDescriptor, e = (c, h, l, i) => {
-  for (var s = i > 1 ? void 0 : i ? B(h, l) : h, n = c.length - 1, d; n >= 0; n--)
-    (d = c[n]) && (s = (i ? d(h, l, s) : d(s)) || s);
-  return i && s && D(h, l, s), s;
+var B = Object.defineProperty, E = Object.getOwnPropertyDescriptor, e = (h, d, a, i) => {
+  for (var s = i > 1 ? void 0 : i ? E(d, a) : d, n = h.length - 1, u; n >= 0; n--)
+    (u = h[n]) && (s = (i ? u(d, a, s) : u(s)) || s);
+  return i && s && B(d, a, s), s;
 };
-let t = class extends x {
+let t = class extends w {
   constructor() {
-    super(), this.defaultSlot = v(), this.forId = _(), this.label = "", this.helptext = "", this.helptextDropdown = "", this.helptextDropdownButton = o.props.helptextDropdownButton.default, this.counter = o.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.optionalTag = o.props.optionalTag.default, this.optionalText = o.props.optionalText.default, this.requiredTag = o.props.requiredTag.default, this.requiredText = o.props.requiredText.default, this.hasError = o.props.hasError.default, this.errorMessage = "", this.disabled = o.props.disabled.default, this.inline = o.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = o.props.hasFieldset.default, this.useWrapper = o.props.useWrapper.default, this.slotController = new k(this, this.defaultSlot);
+    super(), this.defaultSlot = T(), this.forId = _(), this.label = "", this.helptext = "", this.helptextDropdown = "", this.helptextDropdownButton = o.props.helptextDropdownButton.default, this.counter = o.props.counter.default, this.counterCurrent = 0, this.counterMaxLength = 0, this.optionalTag = o.props.optionalTag.default, this.optionalText = o.props.optionalText.default, this.requiredTag = o.props.requiredTag.default, this.requiredText = o.props.requiredText.default, this.hasError = o.props.hasError.default, this.errorMessage = "", this.disabled = o.props.disabled.default, this.inline = o.props.inline.default, this.ariaDescribedby = void 0, this.hasFieldset = o.props.hasFieldset.default, this.useWrapper = o.props.useWrapper.default, this.slotController = new v(this, this.defaultSlot);
   }
   render() {
-    const c = {
+    const h = {
       "pkt-inputwrapper": !0,
       "pkt-inputwrapper--error": this.hasError,
       "pkt-inputwrapper--disabled": this.disabled,
       "pkt-inputwrapper--inline": this.inline
-    }, h = {
+    }, d = {
       "pkt-tag": !0,
       "pkt-tag--small": !0,
       "pkt-tag--thin-text": !0,
       "pkt-tag--blue-light": this.optionalTag,
       "pkt-tag--beige": !this.optionalTag && this.requiredTag
-    }, l = this.helptextDropdown !== "", i = {
+    }, a = this.helptextDropdown !== "", i = {
       "pkt-inputwrapper__label": !0,
       "pkt-inputwrapper__fieldset": this.hasFieldset,
       "pkt-inputwrapper__legend": this.hasFieldset
-    }, s = this.ariaDescribedby ? this.ariaDescribedby : this.helptext ? `${this.forId}-helptext` : a, n = () => this.optionalTag || this.requiredTag ? p`<span class=${u(h)}
-          >${this.optionalTag ? this.optionalText : this.requiredTag ? this.requiredText : a}</span
-        >` : a, d = () => this.useWrapper ? this.hasFieldset ? p`<legend class="pkt-inputwrapper__legend" id="${this.forId}-label">
+    }, s = this.ariaDescribedby ? this.ariaDescribedby : this.helptext ? `${this.forId}-helptext` : l, n = () => this.optionalTag || this.requiredTag ? p`<span class=${c(d)}
+          >${this.optionalTag ? this.optionalText : this.requiredTag ? this.requiredText : l}</span
+        >` : l, u = () => this.useWrapper ? this.hasFieldset ? p`<legend class="pkt-inputwrapper__legend" id="${this.forId}-label">
             ${this.label} ${n()}
-          </legend>` : l ? p`<h2>${this.label} ${n()}</h2>` : p`<span>${this.label} ${n()}</span>` : p`<label
+          </legend>` : a ? p`<h2>${this.label} ${n()}</h2>` : p`<span>${this.label} ${n()}</span>` : p`<label
           for="${this.forId}"
           class="pkt-sr-only"
           aria-describedby="${s}"
           id="${this.forId}-label"
         >
           ${this.label}
-        </label>`, y = () => this.useWrapper && (this.helptext || this.helptextDropdown) ? p`
+        </label>`, g = () => this.useWrapper && (this.helptext || this.helptextDropdown) ? p`
           <pkt-helptext
             .forId=${this.forId}
             .helptext=${this.helptext}
             .helptextDropdown=${this.helptextDropdown}
             .helptextDropdownButton=${this.helptextDropdownButton || o.props.helptextDropdownButton.default}
+            @toggleHelpText=${(x) => {
+      this.toggleDropdown(x);
+    }}
           ></pkt-helptext>
-        ` : a, b = () => this.counter ? p`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
+        ` : l, b = () => this.counter ? p`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
           ${this.counterCurrent || 0}
-          ${this.counterMaxLength ? `/${this.counterMaxLength}` : a}
-        </div>` : a, $ = () => this.hasError && this.errorMessage ? p`<div
+          ${this.counterMaxLength ? `/${this.counterMaxLength}` : l}
+        </div>` : l, y = () => this.hasError && this.errorMessage ? p`<div
           class="pkt-alert pkt-alert--error pkt-alert--compact"
           aria-live="assertive"
           aria-atomic="true"
           id="${this.forId}-error"
         >
           <pkt-icon name="alert-error" class="pkt-alert__icon"></pkt-icon>
-          <div class="pkt-alert__text">${m(this.errorMessage)}</div>
-        </div>` : a, f = () => p`
-        ${d()} ${y()}
-        ${l ? p`<label for="${this.forId}" class="pkt-sr-only" aria-describedby="${s}"
+          <div class="pkt-alert__text">${k(this.errorMessage)}</div>
+        </div>` : l, f = () => p`
+        ${u()} ${g()}
+        ${a ? p`<label for="${this.forId}" class="pkt-sr-only" aria-describedby="${s}"
               >${this.label}</label
-            >` : a}
-        <div class="pkt-contents" ${T(this.defaultSlot)}></div>
-        ${b()} ${$()}
-      `, g = () => this.hasFieldset ? p`<fieldset class=${u(i)} aria-describedby="${s}">
+            >` : l}
+        <div class="pkt-contents" ${D(this.defaultSlot)}></div>
+        ${b()} ${y()}
+      `, $ = () => this.hasFieldset ? p`<fieldset class=${c(i)} aria-describedby="${s}">
             ${f()}
-          </fieldset>` : l ? p`<div class=${u(i)}>${f()}</div>` : p`<label
-              class=${u(i)}
+          </fieldset>` : a ? p`<div class=${c(i)}>${f()}</div>` : p`<label
+              class=${c(i)}
               for="${this.forId}"
               aria-describedby="${s}"
               id="${this.forId}-label"
             >
               ${f()}
             </label>`;
-    return p`<div class=${u(c)}>${g()}</div> `;
+    return p`<div class=${c(h)}>${$()}</div> `;
+  }
+  toggleDropdown(h) {
+    this.dispatchEvent(
+      new CustomEvent("toggleHelpText", {
+        bubbles: !1,
+        detail: { isOpen: h.detail.isOpen }
+      })
+    );
   }
 };
 e([
@@ -136,7 +147,7 @@ e([
   r({ type: Boolean })
 ], t.prototype, "useWrapper", 2);
 t = e([
-  w("pkt-input-wrapper")
+  m("pkt-input-wrapper")
 ], t);
 export {
   t as P

package/dist/pkt-datepicker.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./datepicker-D5Dsxvio.cjs"),t=e.PktDatepicker;Object.defineProperty(exports,"PktDatepicker",{enumerable:!0,get:()=>e.PktDatepicker});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./datepicker-jrTEwP30.cjs"),t=e.PktDatepicker;Object.defineProperty(exports,"PktDatepicker",{enumerable:!0,get:()=>e.PktDatepicker});exports.default=t;

package/dist/pkt-datepicker.js

@@ -1,4 +1,4 @@
-import { P as t } from "./datepicker-BrAEkscZ.js";
+import { P as t } from "./datepicker-ub8Sf0Ol.js";
 const a = t;
 export {
   t as PktDatepicker,

package/dist/pkt-index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./alert-BbVWu2lm.cjs"),u=require("./calendar-QSulz7im.cjs"),d=require("./card-B0GPdG5M.cjs"),t=require("./icon-CdMQ6zBT.cjs"),k=require("./pkt-slot-controller-Ckk_yV0j.cjs"),i=require("./ref-DCOsLZQg.cjs"),P=require("./class-map-Boa7BqCc.cjs"),b=require("./datepicker-D5Dsxvio.cjs"),g=require("./helptext-iZEgxz2U.cjs"),h=require("./input-wrapper-D-PNRJB_.cjs"),m=require("./link-BpqavGSD.cjs"),f=require("./linkcard-DSu3A4Yx.cjs"),y=require("./messagebox-C1aWoQbu.cjs"),v=require("./modal-Avai5eVz.cjs"),x=require("./progressbar-CuXkbAhJ.cjs"),C=require("./tag-CGy2mSLE.cjs"),O=require("./textarea-DfhBTXe_.cjs"),j=require("./textinput-Bm5IU-UB.cjs"),q=require("./select-DduzRK8a.cjs");var S=Object.defineProperty,$=Object.getOwnPropertyDescriptor,o=(a,e,r,s)=>{for(var n=s>1?void 0:s?$(e,r):e,l=a.length-1,p;l>=0;l--)(p=a[l])&&(n=(s?p(e,r,n):p(n))||n);return s&&n&&S(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=i.e(),this.namedSlot=i.e(),this.slotController=new k.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./alert-BbVWu2lm.cjs"),u=require("./calendar-QSulz7im.cjs"),d=require("./card-B0GPdG5M.cjs"),t=require("./icon-CdMQ6zBT.cjs"),k=require("./pkt-slot-controller-Ckk_yV0j.cjs"),i=require("./ref-DCOsLZQg.cjs"),P=require("./class-map-Boa7BqCc.cjs"),b=require("./datepicker-jrTEwP30.cjs"),g=require("./helptext-iZEgxz2U.cjs"),h=require("./input-wrapper-CE_6pjX_.cjs"),m=require("./link-BpqavGSD.cjs"),f=require("./linkcard-DSu3A4Yx.cjs"),y=require("./messagebox-C1aWoQbu.cjs"),v=require("./modal-Avai5eVz.cjs"),x=require("./progressbar-CuXkbAhJ.cjs"),C=require("./tag-CGy2mSLE.cjs"),O=require("./textarea-BG6VBLdw.cjs"),j=require("./textinput-CNdf2O21.cjs"),q=require("./select-Czl01-St.cjs");var S=Object.defineProperty,$=Object.getOwnPropertyDescriptor,o=(a,e,r,s)=>{for(var n=s>1?void 0:s?$(e,r):e,l=a.length-1,p;l>=0;l--)(p=a[l])&&(n=(s?p(e,r,n):p(n))||n);return s&&n&&S(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=i.e(),this.namedSlot=i.e(),this.slotController=new k.PktSlotController(this,this.defaultSlot,this.namedSlot)}connectedCallback(){this.strings.length&&this.strings.forEach(e=>{this._list.push(e.toUpperCase())}),super.connectedCallback()}render(){const e={"pkt-component":!0,"pkt-component--has-list":this.strings.length>0,"pkt-darkmode":this.darkmode};return t.x`
       <div class="${P.e(e)}">
         <h1 class="pkt-txt-28">${this.string}</h1>
 

package/dist/pkt-index.js

@@ -7,18 +7,18 @@ import { a as D } from "./icon-wUXeHiBk.js";
 import { P as x } from "./pkt-slot-controller-RJvOnbF4.js";
 import { e as m, n as d } from "./ref-DuFGTLVX.js";
 import { e as u } from "./class-map-hz16xq5a.js";
-import { P as G } from "./datepicker-BrAEkscZ.js";
+import { P as G } from "./datepicker-ub8Sf0Ol.js";
 import { P as M } from "./helptext--4FLdAWi.js";
-import { P as B } from "./input-wrapper-BTQk3W8T.js";
+import { P as B } from "./input-wrapper-YQW5Ab0s.js";
 import { P as N } from "./link-Bx9nVgZi.js";
 import { P as W } from "./linkcard-CUrbzjLK.js";
 import { P as z } from "./messagebox-LpiVQIoM.js";
 import { P as J } from "./modal-Co1YFmHi.js";
 import { P as V } from "./progressbar-BS_oawSB.js";
 import { P as Y } from "./tag-DGFgUF3l.js";
-import { P as tt } from "./textarea-u9h8Iyx5.js";
-import { P as rt } from "./textinput-Dvln5e5X.js";
-import { P as ot } from "./select-DM0MVMQz.js";
+import { P as tt } from "./textarea-f1BNYK6t.js";
+import { P as rt } from "./textinput-D0tYryXW.js";
+import { P as ot } from "./select-BdKLJx5Z.js";
 var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, o = (t, e, i, a) => {
   for (var r = a > 1 ? void 0 : a ? v(e, i) : e, p = t.length - 1, l; p >= 0; p--)
     (l = t[p]) && (r = (a ? l(e, i, r) : l(r)) || r);

package/dist/pkt-input-wrapper.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./input-wrapper-D-PNRJB_.cjs"),t=e.PktInputWrapper;Object.defineProperty(exports,"PktInputWrapper",{enumerable:!0,get:()=>e.PktInputWrapper});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./input-wrapper-CE_6pjX_.cjs"),t=e.PktInputWrapper;Object.defineProperty(exports,"PktInputWrapper",{enumerable:!0,get:()=>e.PktInputWrapper});exports.default=t;

package/dist/pkt-input-wrapper.js

@@ -1,4 +1,4 @@
-import { P as p } from "./input-wrapper-BTQk3W8T.js";
+import { P as p } from "./input-wrapper-YQW5Ab0s.js";
 const r = p;
 export {
   p as PktInputWrapper,

package/dist/pkt-select.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./select-DduzRK8a.cjs"),t=e.PktSelect;Object.defineProperty(exports,"PktSelect",{enumerable:!0,get:()=>e.PktSelect});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./select-Czl01-St.cjs"),t=e.PktSelect;Object.defineProperty(exports,"PktSelect",{enumerable:!0,get:()=>e.PktSelect});exports.default=t;

package/dist/pkt-select.js

@@ -1,4 +1,4 @@
-import { P as t } from "./select-DM0MVMQz.js";
+import { P as t } from "./select-BdKLJx5Z.js";
 const a = t;
 export {
   t as PktSelect,

package/dist/pkt-textarea.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./textarea-DfhBTXe_.cjs"),t=e.PktTextarea;Object.defineProperty(exports,"PktTextarea",{enumerable:!0,get:()=>e.PktTextarea});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./textarea-BG6VBLdw.cjs"),t=e.PktTextarea;Object.defineProperty(exports,"PktTextarea",{enumerable:!0,get:()=>e.PktTextarea});exports.default=t;

package/dist/pkt-textarea.js

@@ -1,4 +1,4 @@
-import { P as a } from "./textarea-u9h8Iyx5.js";
+import { P as a } from "./textarea-f1BNYK6t.js";
 const e = a;
 export {
   a as PktTextarea,

package/dist/pkt-textinput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./textinput-Bm5IU-UB.cjs"),t=e.PktTextinput;Object.defineProperty(exports,"PktTextinput",{enumerable:!0,get:()=>e.PktTextinput});exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./textinput-CNdf2O21.cjs"),t=e.PktTextinput;Object.defineProperty(exports,"PktTextinput",{enumerable:!0,get:()=>e.PktTextinput});exports.default=t;

package/dist/pkt-textinput.js

@@ -1,4 +1,4 @@
-import { P as t } from "./textinput-Dvln5e5X.js";
+import { P as t } from "./textinput-D0tYryXW.js";
 const p = t;
 export {
   t as PktTextinput,

package/dist/{select-DM0MVMQz.js → select-BdKLJx5Z.js}

@@ -3,7 +3,7 @@ import { r as f } from "./state-BfyXV7EL.js";
 import { e as u, n as d } from "./ref-DuFGTLVX.js";
 import { o as i } from "./if-defined-ZFE4ti2t.js";
 import { P as b } from "./input-element--t-9j6bw.js";
-import "./input-wrapper-BTQk3W8T.js";
+import "./input-wrapper-YQW5Ab0s.js";
 class m {
   constructor(t) {
     this.nodes = [], this.host = t, this.host.addController(this), this.nodes = [];

package/dist/{select-DduzRK8a.cjs → select-Czl01-St.cjs}

@@ -1,4 +1,4 @@
-"use strict";const r=require("./icon-CdMQ6zBT.cjs"),u=require("./state-SKYD8kRO.cjs"),l=require("./ref-DCOsLZQg.cjs"),o=require("./if-defined-DEDlGbAc.cjs"),c=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-D-PNRJB_.cjs");class d{constructor(t){this.nodes=[],this.host=t,this.host.addController(this),this.nodes=[]}hostConnected(){for(Array.from(this.host.childNodes).forEach(t=>{(t.nodeName==="OPTION"||t.nodeName==="DATA")&&this.nodes.push(t)});this.host.firstChild;)this.host.removeChild(this.host.firstChild)}}var $=Object.defineProperty,f=Object.getOwnPropertyDescriptor,h=(n,t,s,e)=>{for(var i=e>1?void 0:e?f(t,s):t,a=n.length-1,p;a>=0;a--)(p=n[a])&&(i=(e?p(t,s,i):p(i))||i);return e&&i&&$(t,s,i),i};exports.PktSelect=class extends c.PktInputElement{constructor(){super(),this.selectRef=l.e(),this.defaultSlot=l.e(),this.options=[],this.value="",this._options=[],this.optionsController=new d(this)}connectedCallback(){super.connectedCallback();const t=this.options.length>0,s=this.optionsController.nodes.length&&this.optionsController.nodes.length>0;!t&&s?this.optionsController.nodes.forEach(e=>{if(!e.textContent&&!e.getAttribute("value"))return null;const i={value:e.getAttribute("value")||e.textContent||"",label:e.textContent||e.getAttribute("value")||""};this._options.push(i)}):this._options=this.options}firstUpdated(t){super.firstUpdated(t),this.options.length&&(this._options=this.options)}render(){const t=`pkt-input ${this.fullwidth?"pkt-input--fullwidth":""}`;return r.x`
+"use strict";const r=require("./icon-CdMQ6zBT.cjs"),u=require("./state-SKYD8kRO.cjs"),l=require("./ref-DCOsLZQg.cjs"),o=require("./if-defined-DEDlGbAc.cjs"),c=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-CE_6pjX_.cjs");class d{constructor(t){this.nodes=[],this.host=t,this.host.addController(this),this.nodes=[]}hostConnected(){for(Array.from(this.host.childNodes).forEach(t=>{(t.nodeName==="OPTION"||t.nodeName==="DATA")&&this.nodes.push(t)});this.host.firstChild;)this.host.removeChild(this.host.firstChild)}}var $=Object.defineProperty,f=Object.getOwnPropertyDescriptor,h=(n,t,s,e)=>{for(var i=e>1?void 0:e?f(t,s):t,a=n.length-1,p;a>=0;a--)(p=n[a])&&(i=(e?p(t,s,i):p(i))||i);return e&&i&&$(t,s,i),i};exports.PktSelect=class extends c.PktInputElement{constructor(){super(),this.selectRef=l.e(),this.defaultSlot=l.e(),this.options=[],this.value="",this._options=[],this.optionsController=new d(this)}connectedCallback(){super.connectedCallback();const t=this.options.length>0,s=this.optionsController.nodes.length&&this.optionsController.nodes.length>0;!t&&s?this.optionsController.nodes.forEach(e=>{if(!e.textContent&&!e.getAttribute("value"))return null;const i={value:e.getAttribute("value")||e.textContent||"",label:e.textContent||e.getAttribute("value")||""};this._options.push(i)}):this._options=this.options}firstUpdated(t){super.firstUpdated(t),this.options.length&&(this._options=this.options)}render(){const t=`pkt-input ${this.fullwidth?"pkt-input--fullwidth":""}`;return r.x`
       <pkt-input-wrapper
         ?counter=${this.counter}
         ?disabled=${this.disabled}

package/dist/{textarea-DfhBTXe_.cjs → textarea-BG6VBLdw.cjs}

@@ -1,4 +1,4 @@
-"use strict";const r=require("./icon-CdMQ6zBT.cjs"),h=require("./state-SKYD8kRO.cjs"),o=require("./ref-DCOsLZQg.cjs"),p=require("./class-map-Boa7BqCc.cjs"),d=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-D-PNRJB_.cjs");/**
+"use strict";const r=require("./icon-CdMQ6zBT.cjs"),h=require("./state-SKYD8kRO.cjs"),o=require("./ref-DCOsLZQg.cjs"),p=require("./class-map-Boa7BqCc.cjs"),d=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-CE_6pjX_.cjs");/**
  * @license
  * Copyright 2020 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause

package/dist/{textarea-u9h8Iyx5.js → textarea-f1BNYK6t.js}

@@ -3,7 +3,7 @@ import { r as f } from "./state-BfyXV7EL.js";
 import { f as b, m as v, e as x, n as T } from "./ref-DuFGTLVX.js";
 import { e as y } from "./class-map-hz16xq5a.js";
 import { P as w } from "./input-element--t-9j6bw.js";
-import "./input-wrapper-BTQk3W8T.js";
+import "./input-wrapper-YQW5Ab0s.js";
 /**
  * @license
  * Copyright 2020 Google LLC

package/dist/{textinput-Bm5IU-UB.cjs → textinput-CNdf2O21.cjs}

@@ -1,4 +1,4 @@
-"use strict";const t=require("./icon-CdMQ6zBT.cjs"),h=require("./state-SKYD8kRO.cjs"),o=require("./ref-DCOsLZQg.cjs"),l=require("./class-map-Boa7BqCc.cjs"),c=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-D-PNRJB_.cjs");var d=Object.defineProperty,x=Object.getOwnPropertyDescriptor,r=(p,i,n,s)=>{for(var e=s>1?void 0:s?x(i,n):i,a=p.length-1,u;a>=0;a--)(u=p[a])&&(e=(s?u(i,n,e):u(e))||e);return s&&e&&d(i,n,e),e};exports.PktTextinput=class extends c.PktInputElement{constructor(){super(...arguments),this.value="",this.type="text",this.size=null,this.autocomplete="off",this.iconNameRight=null,this.prefix=null,this.suffix=null,this.omitSearchIcon=!1,this.counterCurrent=0,this.inputRef=o.e()}attributeChangedCallback(i,n,s){i==="value"&&this.value!==n&&(this.counterCurrent=s?s.length:0,this.valueChanged(s,n)),super.attributeChangedCallback(i,n,s)}updated(i){var n;super.updated(i),i.has("value")&&(this.counterCurrent=((n=this.value)==null?void 0:n.length)||0,this.valueChanged(this.value,i.get("value"))),i.has("id")&&!this.name&&this.id&&(this.name=this.id)}render(){const i=this.type==="search"&&!this.iconNameRight&&!this.omitSearchIcon,n=l.e({"pkt-input":!0,"pkt-input--fullwidth":this.fullwidth,"pkt-input--counter-error":this.counter&&this.counterMaxLength&&this.value.length&&this.value.length>this.counterMaxLength}),s=this.ariaLabelledby||`${this.id}-input-label`;return t.x`
+"use strict";const t=require("./icon-CdMQ6zBT.cjs"),h=require("./state-SKYD8kRO.cjs"),o=require("./ref-DCOsLZQg.cjs"),l=require("./class-map-Boa7BqCc.cjs"),c=require("./input-element-BxMdqhqV.cjs");require("./input-wrapper-CE_6pjX_.cjs");var d=Object.defineProperty,x=Object.getOwnPropertyDescriptor,r=(p,i,n,s)=>{for(var e=s>1?void 0:s?x(i,n):i,a=p.length-1,u;a>=0;a--)(u=p[a])&&(e=(s?u(i,n,e):u(e))||e);return s&&e&&d(i,n,e),e};exports.PktTextinput=class extends c.PktInputElement{constructor(){super(...arguments),this.value="",this.type="text",this.size=null,this.autocomplete="off",this.iconNameRight=null,this.prefix=null,this.suffix=null,this.omitSearchIcon=!1,this.counterCurrent=0,this.inputRef=o.e()}attributeChangedCallback(i,n,s){i==="value"&&this.value!==n&&(this.counterCurrent=s?s.length:0,this.valueChanged(s,n)),super.attributeChangedCallback(i,n,s)}updated(i){var n;super.updated(i),i.has("value")&&(this.counterCurrent=((n=this.value)==null?void 0:n.length)||0,this.valueChanged(this.value,i.get("value"))),i.has("id")&&!this.name&&this.id&&(this.name=this.id)}render(){const i=this.type==="search"&&!this.iconNameRight&&!this.omitSearchIcon,n=l.e({"pkt-input":!0,"pkt-input--fullwidth":this.fullwidth,"pkt-input--counter-error":this.counter&&this.counterMaxLength&&this.value.length&&this.value.length>this.counterMaxLength}),s=this.ariaLabelledby||`${this.id}-input-label`;return t.x`
       <pkt-input-wrapper
         label="${this.label}"
         ?counter=${this.counter}

package/dist/{textinput-Dvln5e5X.js → textinput-D0tYryXW.js}

@@ -3,7 +3,7 @@ import { r as d } from "./state-BfyXV7EL.js";
 import { e as $, n as g } from "./ref-DuFGTLVX.js";
 import { e as m } from "./class-map-hz16xq5a.js";
 import { P as f } from "./input-element--t-9j6bw.js";
-import "./input-wrapper-BTQk3W8T.js";
+import "./input-wrapper-YQW5Ab0s.js";
 var x = Object.defineProperty, y = Object.getOwnPropertyDescriptor, a = (i, e, r, t) => {
   for (var p = t > 1 ? void 0 : t ? y(e, r) : e, u = i.length - 1, l; u >= 0; u--)
     (l = i[u]) && (p = (t ? l(e, r, p) : l(p)) || p);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-elements",
-  "version": "12.18.6",
+  "version": "12.18.8",
   "description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -30,7 +30,7 @@
   },
   "devDependencies": {
     "@oslokommune/punkt-assets": "^12.14.0",
-    "@oslokommune/punkt-css": "^12.17.1",
+    "@oslokommune/punkt-css": "^12.18.7",
     "sass": "^1.78.0",
     "typescript": "^5.6.2",
     "vite": "^5.4.4",
@@ -57,5 +57,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "ac72fa517f291b04958eb8a0d69de61036ed00d8"
+  "gitHead": "a29c9968e505c91cbc40e72031e6661082976478"
 }

package/src/components/input-wrapper/input-wrapper.ts

@@ -155,6 +155,9 @@ export class PktInputWrapper extends PktElement {
             .helptextDropdown=${this.helptextDropdown}
             .helptextDropdownButton=${this.helptextDropdownButton ||
             specs.props.helptextDropdownButton.default}
+            @toggleHelpText=${(e: CustomEvent) => {
+              this.toggleDropdown(e)
+            }}
           ></pkt-helptext>
         `
       } else {
@@ -221,4 +224,13 @@ export class PktInputWrapper extends PktElement {
 
     return html`<div class=${classMap(classes)}>${wrapperElement()}</div> `
   }
+
+  private toggleDropdown(e: CustomEvent) {
+    this.dispatchEvent(
+      new CustomEvent('toggleHelpText', {
+        bubbles: false,
+        detail: { isOpen: e.detail.isOpen },
+      }),
+    )
+  }
 }

package/dist/input-wrapper-D-PNRJB_.cjs

@@ -1,46 +0,0 @@
-"use strict";const t=require("./icon-CdMQ6zBT.cjs"),f=require("./pkt-slot-controller-Ckk_yV0j.cjs"),d=require("./ref-DCOsLZQg.cjs"),l=require("./class-map-Boa7BqCc.cjs"),g=require("./stringutils-CkVRq4jP.cjs"),r=require("./helptext-iZEgxz2U.cjs");var $=Object.defineProperty,I=Object.getOwnPropertyDescriptor,e=(u,n,a,s)=>{for(var p=s>1?void 0:s?I(n,a):n,o=u.length-1,i;o>=0;o--)(i=u[o])&&(p=(s?i(n,a,p):i(p))||p);return s&&p&&$(n,a,p),p};exports.PktInputWrapper=class extends t.PktElement{constructor(){super(),this.defaultSlot=d.e(),this.forId=g.uuidish(),this.label="",this.helptext="",this.helptextDropdown="",this.helptextDropdownButton=r.specs.props.helptextDropdownButton.default,this.counter=r.specs.props.counter.default,this.counterCurrent=0,this.counterMaxLength=0,this.optionalTag=r.specs.props.optionalTag.default,this.optionalText=r.specs.props.optionalText.default,this.requiredTag=r.specs.props.requiredTag.default,this.requiredText=r.specs.props.requiredText.default,this.hasError=r.specs.props.hasError.default,this.errorMessage="",this.disabled=r.specs.props.disabled.default,this.inline=r.specs.props.inline.default,this.ariaDescribedby=void 0,this.hasFieldset=r.specs.props.hasFieldset.default,this.useWrapper=r.specs.props.useWrapper.default,this.slotController=new f.PktSlotController(this,this.defaultSlot)}render(){const n={"pkt-inputwrapper":!0,"pkt-inputwrapper--error":this.hasError,"pkt-inputwrapper--disabled":this.disabled,"pkt-inputwrapper--inline":this.inline},a={"pkt-tag":!0,"pkt-tag--small":!0,"pkt-tag--thin-text":!0,"pkt-tag--blue-light":this.optionalTag,"pkt-tag--beige":!this.optionalTag&&this.requiredTag},s=this.helptextDropdown!=="",p={"pkt-inputwrapper__label":!0,"pkt-inputwrapper__fieldset":this.hasFieldset,"pkt-inputwrapper__legend":this.hasFieldset},o=this.ariaDescribedby?this.ariaDescribedby:this.helptext?`${this.forId}-helptext`:t.E,i=()=>this.optionalTag||this.requiredTag?t.x`<span class=${l.e(a)}
-          >${this.optionalTag?this.optionalText:this.requiredTag?this.requiredText:t.E}</span
-        >`:t.E,c=()=>this.useWrapper?this.hasFieldset?t.x`<legend class="pkt-inputwrapper__legend" id="${this.forId}-label">
-            ${this.label} ${i()}
-          </legend>`:s?t.x`<h2>${this.label} ${i()}</h2>`:t.x`<span>${this.label} ${i()}</span>`:t.x`<label
-          for="${this.forId}"
-          class="pkt-sr-only"
-          aria-describedby="${o}"
-          id="${this.forId}-label"
-        >
-          ${this.label}
-        </label>`,x=()=>this.useWrapper&&(this.helptext||this.helptextDropdown)?t.x`
-          <pkt-helptext
-            .forId=${this.forId}
-            .helptext=${this.helptext}
-            .helptextDropdown=${this.helptextDropdown}
-            .helptextDropdownButton=${this.helptextDropdownButton||r.specs.props.helptextDropdownButton.default}
-          ></pkt-helptext>
-        `:t.E,y=()=>this.counter?t.x`<div class="pkt-input__counter" aria-live="polite" aria-atomic="true">
-          ${this.counterCurrent||0}
-          ${this.counterMaxLength?`/${this.counterMaxLength}`:t.E}
-        </div>`:t.E,k=()=>this.hasError&&this.errorMessage?t.x`<div
-          class="pkt-alert pkt-alert--error pkt-alert--compact"
-          aria-live="assertive"
-          aria-atomic="true"
-          id="${this.forId}-error"
-        >
-          <pkt-icon name="alert-error" class="pkt-alert__icon"></pkt-icon>
-          <div class="pkt-alert__text">${t.o(this.errorMessage)}</div>
-        </div>`:t.E,h=()=>t.x`
-        ${c()} ${x()}
-        ${s?t.x`<label for="${this.forId}" class="pkt-sr-only" aria-describedby="${o}"
-              >${this.label}</label
-            >`:t.E}
-        <div class="pkt-contents" ${d.n(this.defaultSlot)}></div>
-        ${y()} ${k()}
-      `,b=()=>this.hasFieldset?t.x`<fieldset class=${l.e(p)} aria-describedby="${o}">
-            ${h()}
-          </fieldset>`:s?t.x`<div class=${l.e(p)}>${h()}</div>`:t.x`<label
-              class=${l.e(p)}
-              for="${this.forId}"
-              aria-describedby="${o}"
-              id="${this.forId}-label"
-            >
-              ${h()}
-            </label>`;return t.x`<div class=${l.e(n)}>${b()}</div> `}};e([t.n({type:String})],exports.PktInputWrapper.prototype,"forId",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"label",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptext",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptextDropdown",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"helptextDropdownButton",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"counter",2);e([t.n({type:Number})],exports.PktInputWrapper.prototype,"counterCurrent",2);e([t.n({type:Number})],exports.PktInputWrapper.prototype,"counterMaxLength",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"optionalTag",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"optionalText",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"requiredTag",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"requiredText",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"hasError",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"errorMessage",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"disabled",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"inline",2);e([t.n({type:String})],exports.PktInputWrapper.prototype,"ariaDescribedby",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"hasFieldset",2);e([t.n({type:Boolean})],exports.PktInputWrapper.prototype,"useWrapper",2);exports.PktInputWrapper=e([t.t("pkt-input-wrapper")],exports.PktInputWrapper);