@oslokommune/punkt-elements 18.7.2 → 18.9.0

package/CHANGELOG.md

@@ -5,6 +5,45 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [18.9.0](https://github.com/oslokommune/punkt/compare/18.8.0...18.9.0) (2026-09-16)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+Ingen
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
+## [18.8.0](https://github.com/oslokommune/punkt/compare/18.7.3...18.8.0) (2026-09-16)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+* Radio, check og switch: Klikkflate, aria-forbedring og testdekning (#3651). - Fikset klikkområdet til alle tre, slik at hele området er klikkbart både med og uten tile
+  - Forbedret UU-oppførsel for alle tre, med aria-label og aria-describedby på input som peker til label og hjelpetekst. Bedre enn at label skal inneholde hjelpetekst
+  - Oppdaterte alle demo-/testsider med inline-eksempler
+  - Betraktelig oppskalering av testdekning i enhetstester, e2e og conformance
+  - Endringer i skills som reflekterer alt dette
+
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [18.7.2](https://github.com/oslokommune/punkt/compare/18.7.1...18.7.2) (2026-09-14)
 
 ### ⚠ BREAKING CHANGES

package/dist/base-elements/input-element.d.ts

@@ -22,7 +22,7 @@ type Props = ElementProps<PktInputElement, 'defaultValue' | 'disabled' | 'readon
 export declare class PktInputElement<T = {}, TOption extends PktInputOption = PktInputOption> extends PktElementWithSlot<Props & T> {
     static get formAssociated(): boolean;
     internals: any;
-    form: HTMLFormElement | null;
+    get form(): HTMLFormElement | null;
     checked?: boolean | string | null;
     defaultChecked?: boolean;
     multiple?: boolean;
@@ -91,9 +91,10 @@ export declare class PktInputElement<T = {}, TOption extends PktInputOption = Pk
      * @protected
      */
     protected setFormValue(value: string | string[]): void;
+    private radioGroupMembers;
     /**
      * Coordinates radio button group by unchecking other radios with the same name
-     * Only affects radio inputs within the same form
+     * Only affects radio inputs with the same form owner
      *
      * @protected
      */

package/dist/{checkbox-C6JdANel.js → checkbox-BhyUp6l6.js}

@@ -1,7 +1,7 @@
 import { _ as e, d as t, h as n, n as r, u as i } from "./element-J8nynuVk.js";
 import { t as a } from "./class-map-DSoj1J68.js";
 import { n as o, t as s } from "./ref-DNowxdYH.js";
-import { t as c } from "./input-element-Qb0w3ChW.js";
+import { t as c } from "./input-element-BWxgs8L-.js";
 //#region src/components/checkbox/checkbox.ts
 var l = class extends c {
 	constructor(...e) {
@@ -38,18 +38,24 @@ var l = class extends c {
 			"pkt-sr-only": this.hideLabel
 		}), s = "pkt-tag pkt-tag--small pkt-tag--thin-text", c = this.pktStrings.get("forms"), l = () => e`
         ${this.tagText ? e`<span class=${s + " pkt-tag--gray"}>${this.tagText}</span>` : n}
-        ${this.optionalTag ? e`<span class=${s + " pkt-tag--blue-light"}>${this.optionalText ?? c.optional}</span>` : n}
-        ${this.requiredTag ? e`<span class=${s + " pkt-tag--beige"}>${this.requiredText ?? c.required}</span>` : n}
-      `, u = () => e`
+        ${this.optionalTag ? e`<span class=${s + " pkt-tag--blue-light"}
+                >${this.optionalText ?? c.optional}</span
+              >` : n}
+        ${this.requiredTag ? e`<span class=${s + " pkt-tag--beige"}
+                >${this.requiredText ?? c.required}</span
+              >` : n}
+      `, u = this.id + "-check-label", d = this.id + "-check-helptext", f = () => e`
         <label class=${i} for=${this.id + "-internal"}>
-          ${this.label} ${l()}
-          ${this.checkHelptext ? e`<div class="pkt-input-check__input-helptext">${this.checkHelptext}</div>` : n}
+          <span id=${u}>${this.label} ${l()}</span>
+          ${this.checkHelptext ? e`<div id=${d} class="pkt-input-check__input-helptext">
+                  ${this.checkHelptext}
+                </div>` : n}
         </label>
       `;
 		return e`
       <div class="pkt-input-check">
         <div class=${t}>
-          ${this.labelPosition === "left" ? u() : n}
+          ${this.labelPosition === "left" ? f() : n}
           <input
             id=${this.id + "-internal"}
             class=${r}
@@ -64,8 +70,10 @@ var l = class extends c {
             @focus=${this.onFocus}
             ?checked=${this.checked}
             role=${this.isSwitch ? "switch" : "checkbox"}
+            aria-labelledby=${this.label ? u : n}
+            aria-describedby=${this.checkHelptext ? d : n}
           />
-          ${this.labelPosition === "right" ? u() : n}
+          ${this.labelPosition === "right" ? f() : n}
         </div>
       </div>
     `;

package/dist/{checkbox-CddODhna.cjs → checkbox-DJfH-vTj.cjs}

@@ -1,16 +1,22 @@
-const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),n=require("./ref-AuNEkS5a.cjs"),r=require("./input-element-DhIEFeuP.cjs");var i=class extends r.t{constructor(...e){super(...e),this.inputRef=n.t(),this.value=``,this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.isSwitch=!1,this.labelPosition=`right`,this.hideLabel=!1,this.checked=null,this.indeterminate=!1,this.type=`checkbox`,this.tagText=null,this.optionalTag=!1,this.requiredTag=!1}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,t,n){e===`defaultChecked`&&!this.checked&&(this.checked=this.defaultChecked),e===`checked`&&(this.checked=this.checked===``||this.checked===`true`||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e===`indeterminate`&&(this.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,t,n)}firstUpdated(e){this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.firstUpdated(e)}willUpdate(e){super.willUpdate(e),e.has(`defaultChecked`)&&!this.checked&&(this.checked=this.defaultChecked)}updated(e){e.has(`checked`)&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===``||this.checked===`true`||this.checked===!0),e.has(`indeterminate`)&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.updated(e)}render(){let r=t.t({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),i=t.t({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=t.t({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-input-check__input-label--left":this.labelPosition===`left`,"pkt-input-check__input-label--right":this.labelPosition===`right`,"pkt-sr-only":this.hideLabel}),o=`pkt-tag pkt-tag--small pkt-tag--thin-text`,s=this.pktStrings.get(`forms`),c=()=>e._`
+const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),n=require("./ref-AuNEkS5a.cjs"),r=require("./input-element-PN5nWd1A.cjs");var i=class extends r.t{constructor(...e){super(...e),this.inputRef=n.t(),this.value=``,this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.isSwitch=!1,this.labelPosition=`right`,this.hideLabel=!1,this.checked=null,this.indeterminate=!1,this.type=`checkbox`,this.tagText=null,this.optionalTag=!1,this.requiredTag=!1}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,t,n){e===`defaultChecked`&&!this.checked&&(this.checked=this.defaultChecked),e===`checked`&&(this.checked=this.checked===``||this.checked===`true`||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e===`indeterminate`&&(this.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,t,n)}firstUpdated(e){this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.firstUpdated(e)}willUpdate(e){super.willUpdate(e),e.has(`defaultChecked`)&&!this.checked&&(this.checked=this.defaultChecked)}updated(e){e.has(`checked`)&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===``||this.checked===`true`||this.checked===!0),e.has(`indeterminate`)&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===``||this.indeterminate===`true`||this.indeterminate===!0),super.updated(e)}render(){let r=t.t({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),i=t.t({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=t.t({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-input-check__input-label--left":this.labelPosition===`left`,"pkt-input-check__input-label--right":this.labelPosition===`right`,"pkt-sr-only":this.hideLabel}),o=`pkt-tag pkt-tag--small pkt-tag--thin-text`,s=this.pktStrings.get(`forms`),c=()=>e._`
         ${this.tagText?e._`<span class=${o+` pkt-tag--gray`}>${this.tagText}</span>`:e.h}
-        ${this.optionalTag?e._`<span class=${o+` pkt-tag--blue-light`}>${this.optionalText??s.optional}</span>`:e.h}
-        ${this.requiredTag?e._`<span class=${o+` pkt-tag--beige`}>${this.requiredText??s.required}</span>`:e.h}
-      `,l=()=>e._`
+        ${this.optionalTag?e._`<span class=${o+` pkt-tag--blue-light`}
+                >${this.optionalText??s.optional}</span
+              >`:e.h}
+        ${this.requiredTag?e._`<span class=${o+` pkt-tag--beige`}
+                >${this.requiredText??s.required}</span
+              >`:e.h}
+      `,l=this.id+`-check-label`,u=this.id+`-check-helptext`,d=()=>e._`
         <label class=${a} for=${this.id+`-internal`}>
-          ${this.label} ${c()}
-          ${this.checkHelptext?e._`<div class="pkt-input-check__input-helptext">${this.checkHelptext}</div>`:e.h}
+          <span id=${l}>${this.label} ${c()}</span>
+          ${this.checkHelptext?e._`<div id=${u} class="pkt-input-check__input-helptext">
+                  ${this.checkHelptext}
+                </div>`:e.h}
         </label>
       `;return e._`
       <div class="pkt-input-check">
         <div class=${r}>
-          ${this.labelPosition===`left`?l():e.h}
+          ${this.labelPosition===`left`?d():e.h}
           <input
             id=${this.id+`-internal`}
             class=${i}
@@ -25,8 +31,10 @@ const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),
             @focus=${this.onFocus}
             ?checked=${this.checked}
             role=${this.isSwitch?`switch`:`checkbox`}
+            aria-labelledby=${this.label?l:e.h}
+            aria-describedby=${this.checkHelptext?u:e.h}
           />
-          ${this.labelPosition===`right`?l():e.h}
+          ${this.labelPosition===`right`?d():e.h}
         </div>
       </div>
     `}handleInput(e){e.stopImmediatePropagation(),this.onInput()}handleClick(e){if(this.disabled)return e.preventDefault(),e.stopImmediatePropagation(),!1}handleChange(e){if(this.disabled)return e.preventDefault(),e.stopImmediatePropagation(),!1;this.toggleChecked(e)}toggleChecked(e){if(this.disabled){e.preventDefault(),e.stopImmediatePropagation();return}let t=e.target;if(t&&t.disabled){e.preventDefault(),e.stopImmediatePropagation();return}e.stopImmediatePropagation(),this.touched=!0,this.inputRef.value&&(this.checked=this.inputRef.value.matches(`:checked`),this.valueChecked(this.checked))}};e.n([e.u({type:String,reflect:!0})],i.prototype,`value`,void 0),e.n([e.u({type:String})],i.prototype,`checkHelptext`,void 0),e.n([e.u({type:Boolean})],i.prototype,`defaultChecked`,void 0),e.n([e.u({type:Boolean})],i.prototype,`hasTile`,void 0),e.n([e.u({type:Boolean})],i.prototype,`isSwitch`,void 0),e.n([e.u({type:String})],i.prototype,`labelPosition`,void 0),e.n([e.u({type:Boolean})],i.prototype,`hideLabel`,void 0),e.n([e.u({type:Boolean,reflect:!0})],i.prototype,`checked`,void 0),e.n([e.u({type:Boolean,reflect:!0})],i.prototype,`indeterminate`,void 0),e.n([e.u({type:String,reflect:!0})],i.prototype,`type`,void 0),e.n([e.u({type:String})],i.prototype,`tagText`,void 0),e.n([e.u({type:Boolean})],i.prototype,`optionalTag`,void 0),e.n([e.u({type:String})],i.prototype,`optionalText`,void 0),e.n([e.u({type:Boolean})],i.prototype,`requiredTag`,void 0),e.n([e.u({type:String})],i.prototype,`requiredText`,void 0);try{e.d(`pkt-checkbox`)(i)}catch{console.warn(`Forsøker å definere <pkt-checkbox>, men den er allerede definert`)}var a=i;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});

package/dist/combobox-B9Qo7hbt.cjs

@@ -0,0 +1,137 @@
+const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),n=require("./if-defined-BbUZeoaQ.cjs"),r=require("./format-B8meU8Tm.cjs"),i=require("./element-with-slot-C66Jck5e.cjs");require("./icon-BzxBkRyE.cjs");const a=require("./ref-AuNEkS5a.cjs");require("./tag-CGlxtBOH.cjs");const o=require("./repeat-B3ksuY2F.cjs"),s=require("./listbox-kV4OO1Qa.cjs"),c=require("./input-element-PN5nWd1A.cjs"),l=require("./pkt-options-controller-DXAAVcBJ.cjs");require("./input-wrapper-D64Qn-QH.cjs");var u=(e,t,n)=>{switch(e){case`,`:return n?`addValue`:null;case`Enter`:return`addValue`;case`Tab`:case`ArrowDown`:return t?null:`focusListbox`;case`Escape`:return`closeOptions`;default:return null}},d=(e,t,n,r,i)=>{if(!e)return{action:`none`,value:null};let a=s.i(n,e);return!t.includes(e)&&!a?r?{action:`addUserValue`,value:e}:i?{action:`none`,value:null}:{action:`removeValue`,value:t[0]}:a&&!t.includes(a.value)?{action:`selectOption`,value:a.value}:{action:`none`,value:null}},f=(e,t,n,r,i)=>e.trim().toLowerCase()?{...s.c(e,t,n,r),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:``,shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},p=(e,t,n)=>{let r=s.i(t,e);return n===`label`&&r?.label?r.label:e},m={markOptionSelected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!0;break}}},markOptionDeselected(e,t){if(t){for(let n of e)if(n.value===t){n.selected=!1;break}}},markAllSelected(e){for(let t of e)t.selected=!0},markAllDeselected(e){for(let t of e)t.selected=!1},removeUserAddedOptions(e){return e.filter(e=>!e.userAdded)}},h={parseOptionsFromSlot(e){let t=[];return e.forEach(e=>{if(!e.textContent&&!e.getAttribute(`value`))return;let n={value:e.getAttribute(`value`)||e.textContent||``,label:e.textContent||e.getAttribute(`value`)||``};e.getAttribute(`data-prefix`)&&(n.prefix=e.getAttribute(`data-prefix`)||void 0),e.getAttribute(`tagskincolor`)&&(n.tagSkinColor=e.getAttribute(`tagskincolor`)),e.getAttribute(`description`)&&(n.description=e.getAttribute(`description`)||void 0),n.fulltext=s.r(n),t.push(n)}),t}},g={cloneOptions(e){return Array.isArray(e)?e.map(e=>({...e})):[]},syncOptionsWithValues(e,t){let n=[...t];return e.forEach(e=>{e.value&&!e.label&&(e.label=e.value),e.selected&&!n.includes(e.value)&&n.push(e.value),e.fulltext=s.r(e),e.selected=e.selected||n.includes(e.value)}),{options:e,newValues:n}},mergeWithUserAdded(e,t,n){return[...t.filter(e=>e?.userAdded&&n.includes(e.value)).filter(t=>!(Array.isArray(e)?e:[]).some(e=>e.value===t.value)),...e]}},_={name:`pkt-combobox`,react:`PktCombobox`,"css-class":`pkt-combobox`,isElement:!0,isPureReact:!0,props:{name:{type:`string`,name:`Navn`,description:`Navn som brukes i skjema ved innsending`,category:`tech`},form:{name:`Skjema`,description:`ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet`,type:`string`,required:!1,category:`tech`},id:{type:`string`,name:`ID`,description:`Unik ID for feltet`,category:`tech`},label:{type:`string`,name:`Etikett/label`,description:`Tekst som vises over feltet`,category:`contents`},placeholder:{name:`Hint`,description:`Spesifiserer en kort hint som beskriver forventet verdi av feltet.`,type:`string`,category:`contents`,required:!1},multiple:{type:`boolean`,name:`Flervalg`,default:!1,description:`Mulighet for å velge flere valg`,category:`functionality`},tagPlacement:{attribute:`tag-placement`,type:[`inside`,`outside`],name:`Plassering av tags i flervalg`,description:`Plassering av valgte verdier i feltet ved flervalg`,category:`functionality`,showIf:{multiple:!0}},maxlength:{type:`number`,name:`Maks antall i flervalg`,description:`Maks antall valg dersom flervalg er aktivert`,category:`functionality`,showIf:{multiple:!0}},typeahead:{type:`boolean`,name:`Typeahead`,default:!1,description:`Mulighet for automatisk utfylling av feltet fra listen over valg`,category:`functionality`},includeSearch:{attribute:`include-search`,type:`boolean`,name:`Inkluder søk`,description:`Mulighet for å søke etter valg inni dropdown`,category:`functionality`},allowUserInput:{attribute:`allow-user-input`,type:`boolean`,name:`Brukervalgte verdier`,description:`Mulighet for å skrive inn egne verdier`,category:`functionality`},searchPlaceholder:{attribute:`search-placeholder`,type:`string`,name:`Søke-plassholder`,description:`Plassholdertekst for søkefeltet i dropdown`,category:`contents`,showIf:{includeSearch:!0}},displayValueAs:{attribute:`display-value-as`,type:[`label`,`value`,`prefixAndValue`],name:`Visning av valgt verdi`,description:`Hvordan valgt verdi vises i feltet`,default:`label`,category:`ui`},inputSize:{name:`Størrelse`,description:`Visuell størrelse via input-wrapper. small: kompakt wrapper og felt (42px). xsmall: samme wrapper som small, felt 36px.`,attribute:`input-size`,type:[`small`,`medium`,`xsmall`],default:`medium`,category:`ui`},value:{name:`Verdi`,type:`string`,description:`Valgt verdi. Streng ved enkelt valg, array av strenger ved flervalg.`,category:`tech`},helptext:{type:`string`,name:`Hjelpetekst`,description:`Hjelpetekst som vises over feltet`,category:`contents`},helptextDropdown:{attribute:`helptextdropdown`,type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{attribute:`helptextdropdownbutton`,type:`string`,name:`Knappetekst for hjelpetekst`,description:`Tekst som vises på knappen for å åpne/lukke utvidet hjelpetekst`,category:`contents`,default:`Les mer`},disabled:{type:`boolean`,name:`Deaktivert`,description:`Feltet er deaktivert`,category:`tech`},hasError:{attribute:`haserror`,type:`boolean`,name:`Feil`,description:`Feltet har en feil`,category:`ui`},errorMessage:{attribute:`errormessage`,type:`string`,name:`Feilmelding`,description:`Tekst som vises under feltet ved feil`,category:`contents`},required:{type:`boolean`,name:`Påkrevd`,description:`Feltet må fylles ut`,category:`tech`},requiredTag:{attribute:`requiredtag`,type:`boolean`,name:`Påkrevd-merking`,description:`Viser en merking som indikerer at feltet er påkrevd`,category:`ui`},requiredText:{attribute:`requiredtext`,type:`string`,name:`Påkrevd-tekst`,description:`Tekst som vises i påkrevd-merkingen`,category:`contents`},optionalTag:{attribute:`optionaltag`,type:`boolean`,name:`Valgfritt-merking`,description:`Viser en merking som indikerer at feltet er valgfritt`,category:`ui`},optionalText:{attribute:`optionaltext`,type:`string`,name:`Valgfritt-tekst`,description:`Tekst som vises i valgfritt-merkingen`,category:`contents`},tagText:{attribute:`tagtext`,type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},fullwidth:{type:`boolean`,name:`Full bredde`,description:`Skal feltet ta opp hele bredden?`,category:`ui`},defaultOptions:{attribute:`default-options`,name:`Initielle valg (default options)`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter (denne vil ikke modifiseres ved endring innad i komponenten)`,type:`array`,default:[],previewDefault:[{value:`bfr`,label:`Frogner`},{value:`bgo`,label:`Gamle Oslo`},{value:`bgr`,label:`Grorud`},{value:`bxx`,label:`Andre bydeler`}],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},options:{name:`Valg`,type:`array`,description:`Liste over valg som kan velges, om options sendes inn som array med objekter`,default:[],items:{type:`object`,properties:{value:{type:`string`,description:`Verdi som sendes ved valg`},label:{type:`string`,description:`Tekst som vises for valget`},prefix:{type:`string`,description:`Tekst som vises før valget`},description:{type:`string`,description:`Beskrivelse av valget`},disabled:{type:`boolean`,description:`Valget er deaktivert`},selected:{type:`boolean`,description:`Valget er valgt`},tagSkinColor:{type:[`blue`,`blue-dark`,`blue-light`,`green`,`red`,`yellow`,`beige`,`gray`,`grey`],description:`Farge på tag`}},required:[`value`]},category:`contents`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},useWrapper:{attribute:`usewrapper`,name:`Bruk wrapper`,type:`boolean`,required:!1,displayAsFalse:!0,default:!0,description:`Indikerer om skjemaelementet skal bruke en wrapper`,category:`ui`},hasFieldset:{attribute:`hasfieldset`,name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet ikke har en input.`,category:`ui`},counter:{name:`Teller`,type:`boolean`,required:!1,default:null,description:`Viser teller under feltet. Slås på av seg selv når det finnes en grense å telle mot; sett til false for å skru den av.`,category:`ui`},defaultValue:{attribute:`defaultvalue`,type:`string | string[]`,name:`Standardverdi`,description:`Verdien feltet får ved oppstart og ved nullstilling av skjemaet`,category:`functionality`}},events:{change:{type:`Event`,description:`Returnerer valgt verdi som streng. Ved flervalg returneres kommaseparerte verdier.`},"value-change":{type:`CustomEvent`,description:`Returnerer valgt verdi. Ved enkeltvalg en streng, ved flervalg en <code>string[]</code>.`},search:{type:`CustomEvent`,description:`Returnerer søketeksten som streng i <code>event.detail</code> når brukeren skriver i søkefeltet`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`}}},v=class extends c.t{constructor(){super(),this.value=``,this.options=[],this.defaultOptions=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder=null,this.multiple=!1,this.maxlength=null,this.displayValueAs=_.props.displayValueAs.default,this.tagPlacement=null,this.isOpen=!1,this._options=[],this._value=[],this._isOptionsOpen=!1,this._userInfoMessage=``,this._messageValue=null,this._addValueText=null,this._maxIsReached=!1,this._search=``,this._inputFocus=!1,this._skipInputTab=!1,this._optionsFromSlot=!1,this._lastSlotGeneration=0,this._suppressNextOpen=!1,this.inputRef=a.t(),this.triggerRef=a.t(),this.listboxRef=a.t(),this._pendingDispatchFrom=null,this.optionsController=new l.t(this)}get _hasTextInput(){return this.typeahead||this.allowUserInput}get _selectionDescription(){if(!(!this.multiple||this._value.length===0))return`${this._value.length} valgt`}focusTrigger(){this._hasTextInput?this.inputRef.value?.focus():this.triggerRef.value?.focus()}focusAfterCommit(){this._skipInputTab=!0;let e=this.inputRef.value;e&&e.type!==`hidden`&&e.setAttribute(`tabindex`,`-1`),this.triggerRef.value?.focus()}restoreInputTab(){this._skipInputTab=!1}parseValue(){return this.parseToValues(this.value)}parseToValues(e){return Array.isArray(e)?this.multiple?e:e.length>0?[e[0]]:[]:e&&this.multiple?e.split(`,`):e?[e]:[]}updateMaxReached(){this._maxIsReached=s.l(this._value.length,this.maxlength)}syncPublicValue(){let e=this.multiple?this._value.join(`,`):this._value[0]||``;e!==(Array.isArray(this.value)?this.value.join(`,`):String(this.value||``))&&(this.value=e)}dispatchValueChange(e){let t=this._value;if(e?.join(`,`)!==t.join(`,`)){let e=this.multiple?[...t]:t[0]||``;this.onChange(e)}else t.length===0&&e&&e.length>0&&this.clearInputValue()}onChange(e){this.touched=!0,super.onChange(e)}valueChanged(){}};e.n([e.u({type:String,reflect:!0})],v.prototype,`value`,void 0),e.n([e.u({type:Array})],v.prototype,`options`,void 0),e.n([e.u({type:Array,attribute:`default-options`})],v.prototype,`defaultOptions`,void 0),e.n([e.u({type:Boolean,attribute:`allow-user-input`})],v.prototype,`allowUserInput`,void 0),e.n([e.u({type:Boolean})],v.prototype,`typeahead`,void 0),e.n([e.u({type:Boolean,attribute:`include-search`})],v.prototype,`includeSearch`,void 0),e.n([e.u({type:String,attribute:`search-placeholder`})],v.prototype,`searchPlaceholder`,void 0),e.n([e.u({type:Boolean})],v.prototype,`multiple`,void 0),e.n([e.u({type:Number})],v.prototype,`maxlength`,void 0),e.n([e.u({type:String,attribute:`display-value-as`})],v.prototype,`displayValueAs`,void 0),e.n([e.u({type:String,attribute:`tag-placement`})],v.prototype,`tagPlacement`,void 0),e.n([e.u({type:Boolean,attribute:`open`})],v.prototype,`isOpen`,void 0),e.n([e.l()],v.prototype,`_options`,void 0),e.n([e.l()],v.prototype,`_value`,void 0),e.n([e.l()],v.prototype,`_isOptionsOpen`,void 0),e.n([e.l()],v.prototype,`_userInfoMessage`,void 0),e.n([e.l()],v.prototype,`_messageValue`,void 0),e.n([e.l()],v.prototype,`_addValueText`,void 0),e.n([e.l()],v.prototype,`_maxIsReached`,void 0),e.n([e.l()],v.prototype,`_search`,void 0),e.n([e.l()],v.prototype,`_inputFocus`,void 0),e.n([e.l()],v.prototype,`_skipInputTab`,void 0);var y=class extends v{toggleValue(e){if(this.disabled)return;this.touched=!0,this._userInfoMessage=``,this._addValueText=null;let t=s.i(this.options,e)?.value||null,n=this._value.includes(e||t||``),r=!!t,i=this._options.find(t=>t.value===e)?.disabled||!1,a=!e?.trim(),o=!this.multiple,c=this.multiple,l=s.l(this._value.length,this.maxlength),u=!1,d=!0,f=``,m=null,h=``;i||(!r&&this.allowUserInput&&!a?(this.addNewUserValue(e),f=`valueAdded`,u=c):!r&&!this.allowUserInput?(o&&this._value[0]&&this.removeValue(this._value[0]),d=!1,u=!0,f=`noResults`):n?(this.removeValue(t),u=!0,o&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``)):a&&o?(this.removeAllSelected(),u=!0):o?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),u=!1,f=`valueSelected`,m=this._hasTextInput?p(t||``,this.options,this.displayValueAs):s.s(s.i(this.options,t),this.displayValueAs)):c&&!l?(this.setSelected(t),u=!0):c&&l?(f=`maxSelected`,d=!1,h=e):(o&&this.removeAllSelected(),f=`noValidValue`,d=!1,u=!0,h=e),this._isOptionsOpen=u,u||window.setTimeout(()=>{this.focusAfterCommit()},0),this._search=h||``,this.resetComboboxInput(d),this._userInfoMessage=f,this._messageValue=m,c&&this.updateMaxReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&s.l(this._value.length,this.maxlength)){this._userInfoMessage=`maxSelected`;return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,m.markOptionSelected(this._options,e),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(t=>t!==e);let t=s.i(this.options,e);t&&(m.markOptionDeselected(this.options,e),t.userAdded?(this._options=[...this._options.filter(t=>t.value!==e)],this.options=[...this.options.filter(t=>t.value!==e)]):this._options.some(t=>t.value===e)||(this._options=[...this._options,t]))}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage=`tooManySelected`;return}this._value=this._options.map(e=>e.value),m.markAllSelected(this._options),this.requestUpdate()}}removeAllSelected(){this._value=[],m.markAllDeselected(this._options),this._options=m.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){let e=this.inputRef.value?.value.trim()||``;if(this._search=e,e&&this._value.includes(e)){this.resetComboboxInput(!0),this._userInfoMessage=`alreadySelected`;return}this.toggleValue(e)}removeValue(e){this._value=this.multiple?this._value.filter(t=>t!==e):[],this.removeSelected(e)}addNewUserValue(e){if(!e||e.trim()===``)return;if(!this.multiple)this._value[0]&&this.removeSelected(this._value[0]),this._value=[e];else if(!s.i(this.options,e)){if(s.l(this._value.length,this.maxlength))return;this._value=[...this._value,e]}let t={value:e,label:e,userAdded:!0,selected:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.resetComboboxInput(!0),this.multiple||(this._isOptionsOpen=!1,window.setTimeout(()=>{this.focusAfterCommit()},0)),this.requestUpdate()}refreshOptionsFromValue(){let e=g.cloneOptions(this.options);e.forEach(e=>e.selected=this._value.includes(e.value)),this._options=g.syncOptionsWithValues(e,this._value).options}resetComboboxInput(e=!0){this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!==`hidden`&&e&&(this._search=``,this.multiple?this.inputRef.value.value=``:(this.inputRef.value.value=this._value[0]?p(this._value[0],this.options,this.displayValueAs):``,this._userInfoMessage=``)),this.refreshOptionsFromValue()}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();let t=this._value[this._value.length-1];t&&this.removeSelected(t),this.updateMaxReached()}},b=class extends y{handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.disabled)return;this.touched=!0;let t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead){if(this._search){let{filtered:n,suggestion:r}=s.o(this.options,this._search);this._options=n,e.inputType!==`deleteContentBackward`&&r?.label&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(t.value=r.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection=`backward`)}else this.refreshOptionsFromValue()}}handleFocus(){if(!this.disabled){if(this._skipInputTab=!1,this._suppressNextOpen){this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate();return}!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=p(this._value[0],this.options,this.displayValueAs)),this._inputFocus=!0,this._search=``,this.refreshOptionsFromValue(),this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleCloseOptions(){this._isOptionsOpen=!1,this._hasTextInput&&(this._suppressNextOpen=!0),this.focusTrigger()}handleFocusOut(e){if(this.disabled||!this._isOptionsOpen)return;let t=e.relatedTarget;t?.closest(`pkt-combobox`)?.id===this.id||e.target?.classList?.contains(`pkt-combobox__value`)||t===this.inputRef.value||t===this.triggerRef.value||this.closeAndProcessInput()}closeAndProcessInput(){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage=``,this._search=``,this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=this.inputRef.value.value;if(!this.multiple){if(!e)this._value[0]&&this.removeSelected(this._value[0]);else{let t=s.i(this.options,e);t&&t.value!==this._value[0]?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t.value)):!t&&this.allowUserInput&&(this._value[0]&&this.removeSelected(this._value[0]),this.addNewUserValue(e))}}else if(e!==``){let{action:t,value:n}=d(e,this._value,this.options,this.allowUserInput,this.multiple);switch(t){case`addUserValue`:this.addNewUserValue(n);break;case`selectOption`:this.setSelected(n);break;case`removeValue`:this.removeValue(n)}}!this.multiple&&this._value[0]?this.inputRef.value.value=p(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=``}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(e){if(this.disabled){e.preventDefault(),e.stopImmediatePropagation();return}this._hasTextInput?(this.inputRef.value?.focus(),this.requestUpdate()):(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen&&this.listboxRef.value?.focusFirstOrSelectedOption())}handlePlaceholderClick(e){this.disabled||(e.stopPropagation(),this._hasTextInput&&this.inputRef.value?(this.inputRef.value.focus(),this._inputFocus=!0,this.requestUpdate()):(this._isOptionsOpen=!this._isOptionsOpen,this.requestUpdate()))}handleSelectOnlyKeydown(e){if(!this.disabled)switch(e.key){case`Enter`:case` `:case`ArrowDown`:case`ArrowUp`:e.preventDefault(),this._isOptionsOpen?this._isOptionsOpen=!1:(this._isOptionsOpen=!0,this.listboxRef.value?.focusFirstOrSelectedOption());break;case`Escape`:this._isOptionsOpen&&=(e.preventDefault(),!1);break;case`Home`:case`End`:e.preventDefault(),this._isOptionsOpen||=!0,this.listboxRef.value?.focusFirstOrSelectedOption();break;case`ArrowLeft`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.focusTag(this._value.length-1));break;case`Backspace`:case`Delete`:this.multiple&&this._value.length>0&&(e.preventDefault(),this.removeSelected(this._value[this._value.length-1]))}}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase(),this.checkForMatches()}handleInputKeydown(e){if(e.key===`Backspace`){let t=!this.inputRef.value?.value;!this._search&&t&&this.multiple&&this._value.length>0&&this.removeLastValue(e);return}if(e.key===`ArrowLeft`&&this.multiple&&this._value.length>0){let t=this.inputRef.value;if(t&&t.selectionStart===0&&!t.value){e.preventDefault(),this.focusTag(this._value.length-1);return}}let t=u(e.key,e.shiftKey,this.multiple);if(t&&!(e.key===`Tab`&&!this._isOptionsOpen)){if(t===`focusListbox`&&e.key===`Tab`&&!this.listboxRef.value?.querySelector(`[role="option"]:not([data-disabled]), [data-type="new-option"]`)){this.closeAndProcessInput();return}switch(e.preventDefault(),t){case`addValue`:this.addValue();break;case`focusListbox`:this.listboxRef.value?.focusFirstOrSelectedOption();break;case`closeOptions`:this._isOptionsOpen=!1}}}handleTagRemove(e){this.removeSelected(e),this._hasTextInput&&this.inputRef.value&&(this._inputFocus=!0,this.inputRef.value.focus(),this.requestUpdate())}getInsideTags(){return Array.from(this.querySelectorAll(`.pkt-combobox__input .pkt-combobox__tag-list pkt-tag`))}focusTag(e){let t=this.getInsideTags();t.forEach((t,n)=>{t.buttonTabindex=n===e?0:-1}),(t[e]?.querySelector(`button`))?.focus()}resetTagTabindices(){this.getInsideTags().forEach(e=>{e.buttonTabindex=-1})}handleTagKeydown(e,t){e.stopPropagation();let n=()=>{this.resetTagTabindices(),this._hasTextInput&&this.inputRef.value?this.inputRef.value.focus():this.triggerRef.value?.focus()};switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&this.focusTag(t-1);break;case`ArrowRight`:e.preventDefault(),t<this._value.length-1?this.focusTag(t+1):n();break;case`Backspace`:case`Delete`:e.preventDefault();{let e=this._value[t],r=t>=this._value.length-1?t-1:t;this.removeSelected(e),r>=0?(this.requestUpdate(),this.updateComplete.then(()=>this.focusTag(r))):n()}break;case`Tab`:this.resetTagTabindices();break;case`Escape`:e.preventDefault(),n()}}checkForMatches(){let e=f(this.inputRef.value?.value||this._search||``,this._value,this.options,this.allowUserInput,this.multiple);if(e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput){this.resetComboboxInput(!1);return}this._addValueText=e.addValueText,this._userInfoMessage=e.userInfoMessage}},x=class extends b{constructor(...e){super(...e),this.handleBodyClick=e=>{this._isOptionsOpen&&!this.contains(e.target)&&this.closeAndProcessInput()}}connectedCallback(){if(super.connectedCallback(),document?.body.addEventListener(`click`,this.handleBodyClick),this._options=[],this.defaultOptions&&this.defaultOptions.length){let e=this.options?.filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=g.cloneOptions(this.options)}if(this.optionsController?.nodes&&this.optionsController.nodes.length){let e=h.parseOptionsFromSlot(this.optionsController.nodes);e.length&&(this.options=[...e],this._options=[...e],this._optionsFromSlot=!0,this._lastSlotGeneration=this.optionsController.generation)}}disconnectedCallback(){super.disconnectedCallback(),document?.body.removeEventListener(`click`,this.handleBodyClick)}firstUpdated(e){this.defaultValue!==null&&!this.value&&(this.value=this.defaultValue),super.firstUpdated(e)}willUpdate(e){if(this._optionsFromSlot&&this.optionsController){let e=this.optionsController.generation;if(e!==this._lastSlotGeneration){this._lastSlotGeneration=e;let t=h.parseOptionsFromSlot(this.optionsController.nodes),n=this._options.filter(e=>e.userAdded);this.options=[...n,...t]}}if(super.willUpdate(e),e.has(`isOpen`)&&(this._isOptionsOpen=this.isOpen),e.has(`defaultOptions`)&&this.defaultOptions.length){let e=(Array.isArray(this.options)?this.options:[]).filter(e=>e.userAdded)||[];this.options=[...e,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=g.cloneOptions(this.options)}let t=e.has(`value`),n=e.has(`_value`);if(t){let e=[...this._value],t=this.parseValue();t.join(`,`)!==this._value.join(`,`)&&(this._value=t,this._options.forEach(e=>e.selected=t.includes(e.value)),this._options=[...this._options]),this._pendingDispatchFrom??=e}else n&&(this._pendingDispatchFrom??=e.get(`_value`)??[]);if(e.has(`defaultValue`)&&this.defaultValue!=null&&!this._value.length){let e=this.parseToValues(this.defaultValue);e.length&&(this._pendingDispatchFrom??=[...this._value],this._value=e,this._options.forEach(t=>t.selected=e.includes(t.value)),this._options=[...this._options])}if(e.has(`options`)){let t=e.get(`options`)||this._options||[],n=g.mergeWithUserAdded(g.cloneOptions(this.options),t,this._value);this._options=n,n.length>this.options.length&&(this.options=n);let r=g.syncOptionsWithValues(this._options,this._value);this._options=r.options,r.newValues.length>this._value.length&&(this._pendingDispatchFrom??=[...this._value],this._value=r.newValues)}(t||n||e.has(`options`)||e.has(`defaultValue`))&&this.updateMaxReached(),this._pendingDispatchFrom&&this.syncPublicValue()}updated(e){if(this._pendingDispatchFrom){let e=this._pendingDispatchFrom;this._pendingDispatchFrom=null,this.dispatchValueChange(e)}if(e.has(`_search`)&&this.dispatchEvent(new CustomEvent(`search`,{detail:this._search,bubbles:!1})),!this._isOptionsOpen&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!==`hidden`){let e=!this.multiple&&this._value[0]?p(this._value[0],this.options,this.displayValueAs):``;this.inputRef.value.value!==e&&(this.inputRef.value.value=e)}this.classList.add(`pkt-combobox-component`),this.classList.toggle(`pkt-combobox-component--fullwidth`,!!this.fullwidth),super.updated(e)}formResetCallback(){this.touched=!1;let e=this.defaultValue||(this.multiple,``);this.value=e,this._value=this.parseValue(),this._options=this._options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this.options=this.options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this._search=``,this._isOptionsOpen=!1,this._userInfoMessage=``,this._addValueText=null,this._inputFocus=!1,this.updateMaxReached(),this.inputRef.value&&this.inputRef.value.type!==`hidden`&&(this.inputRef.value.value=``),this.internals.setFormValue(``),this.internals.ariaInvalid=`false`,this.requestUpdate()}attributeChangedCallback(e,t,n){if(e===`options`){this._options=g.cloneOptions(this.options);let e=g.syncOptionsWithValues(this._options,this._value);this._options=e.options,e.newValues.length>this._value.length&&(this._value=e.newValues),this._search=``}super.attributeChangedCallback(e,t,n)}render(){return e._`
+      <pkt-input-wrapper
+        .strings=${this.strings}
+        .size=${this.inputSize}
+        .label=${this.label}
+        .helptext=${this.helptext}
+        .helptextDropdown=${n.t(this.helptextDropdown)}
+        .helptextDropdownButton=${n.t(this.helptextDropdownButton)}
+        ?fullwidth=${this.fullwidth}
+        ?counter=${this.effectiveCounter(!!this.multiple&&this.maxlength!=null)}
+        .counterCurrent=${this._value.length}
+        .counterMaxLength=${this.maxlength??0}
+        ?hasError=${this.hasError}
+        ?inline=${this.inline}
+        ?disabled=${this.disabled}
+        .errorMessage=${this.errorMessage}
+        ?optionalTag=${this.optionalTag}
+        .optionalText=${this.optionalText}
+        ?requiredTag=${this.requiredTag}
+        .requiredText=${this.requiredText}
+        .tagText=${this.tagText}
+        useWrapper=${this.useWrapper}
+        .forId=${this._hasTextInput?this.id+`-input`:this.id+`-combobox`}
+        ?hasFieldset=${this.effectiveHasFieldset(!this._hasTextInput)}
+        class="pkt-combobox__wrapper"
+        @labelClick=${this.handleInputClick}
+      >
+        <div class="pkt-contents" slot="helptext">${i.r(this,`helptext`)}</div>
+        <div class="pkt-combobox" @focusout=${this.handleFocusOut}>
+          <div
+            class=${t.t({"pkt-combobox__input":!0,[`pkt-combobox__input--${this.inputSize}`]:!0,"pkt-combobox__input--fullwidth":this.fullwidth,"pkt-combobox__input--open":this._isOptionsOpen,"pkt-combobox__input--error":this.hasError,"pkt-combobox__input--disabled":this.disabled})}
+            id=${n.t(this._hasTextInput?void 0:`${this.id}-combobox`)}
+            role=${n.t(this._hasTextInput?void 0:`combobox`)}
+            aria-expanded=${n.t(this._hasTextInput?void 0:this._isOptionsOpen?`true`:`false`)}
+            aria-controls=${n.t(this._hasTextInput?void 0:`${this.id}-listbox`)}
+            aria-haspopup=${n.t(this._hasTextInput?void 0:`listbox`)}
+            aria-labelledby=${n.t(this._hasTextInput?void 0:`${this.id}-combobox-label`)}
+            aria-activedescendant=${n.t(!this._hasTextInput&&this._isOptionsOpen&&this._value[0]&&s.i(this.options,this._value[0])?`${this.id}-listbox-${s.a(this._options,this._value[0])}`:void 0)}
+            aria-description=${n.t(this._selectionDescription||void 0)}
+            tabindex=${this._hasTextInput||this.disabled?`-1`:`0`}
+            @click=${this.handleInputClick}
+            @keydown=${this._hasTextInput?e.h:this.handleSelectOnlyKeydown}
+            @blur=${this.restoreInputTab}
+            ${a.n(this.triggerRef)}
+          >
+            ${!this._hasTextInput&&this.placeholder&&(!this._value.length||this.multiple&&this.tagPlacement==`outside`)&&!this._inputFocus?e._`<span class="pkt-combobox__placeholder" @click=${this.handlePlaceholderClick}
+                    >${this.placeholder}</span
+                  >`:this.tagPlacement===`outside`?e.h:this.renderSingleOrMultipleValues()}
+            ${this.renderInputField()}
+            <pkt-icon
+              class=${t.t({"pkt-combobox__arrow-icon":!0,"pkt-combobox__arrow-icon--open":this._isOptionsOpen})}
+              name="chevron-thin-down"
+              aria-hidden="true"
+            ></pkt-icon>
+          </div>
+
+          <pkt-listbox
+            id="${this.id}-listbox"
+            .options=${this._options}
+            .isOpen=${this._isOptionsOpen}
+            .searchPlaceholder=${this.searchPlaceholder}
+            .label="Liste: ${this.label||``}"
+            ?disabled=${this.disabled}
+            ?include-search=${this.includeSearch}
+            ?is-multi-select=${this.multiple}
+            ?allow-user-input=${this.allowUserInput&&!this._maxIsReached}
+            ?max-is-reached=${this._maxIsReached}
+            .customUserInput=${n.t(this._addValueText)}
+            .userMessage=${this._userInfoMessage?r.t(this.pktStrings.get(`combobox`)[this._userInfoMessage],{value:this._messageValue??``}):``}
+            @search=${this.handleSearch}
+            @option-toggle=${this.handleOptionToggled}
+            @select-all=${this.addAllOptions}
+            @close-options=${this.handleCloseOptions}
+            @tab-close=${()=>this.closeAndProcessInput()}
+            .searchValue=${this._search||null}
+            .maxLength=${this.maxlength||0}
+            ${a.n(this.listboxRef)}
+          ></pkt-listbox>
+        </div>
+
+        ${this.tagPlacement===`outside`&&this.multiple?e._`<div class="pkt-combobox__tags-outside">
+                ${this.renderSingleOrMultipleValues()}
+              </div>`:e.h}
+      </pkt-input-wrapper>
+    `}renderInputField(){return this.typeahead||this.allowUserInput?e._`
+          <div class="pkt-combobox__input-div combobox__input">
+            <input
+              type="text"
+              id="${this.id}-input"
+              name=${(this.name||this.id)+`-input`}
+              placeholder=${n.t(!this._value.length||this.multiple&&this.tagPlacement===`outside`?this.placeholder:void 0)}
+              @input=${this.handleInput}
+              @change=${e=>{e.stopPropagation(),e.stopImmediatePropagation()}}
+              tabindex=${n.t(this._skipInputTab?`-1`:void 0)}
+              @keydown=${this.handleInputKeydown}
+              @focus=${this.handleFocus}
+              @blur=${this.handleBlur}
+              autocomplete="off"
+              role="combobox"
+              aria-expanded=${this._isOptionsOpen?`true`:`false`}
+              aria-label=${n.t(this.label)}
+              aria-autocomplete=${this.typeahead?`both`:this.allowUserInput?`list`:`none`}
+              aria-controls="${this.id}-listbox"
+              aria-activedescendant=${n.t(this._isOptionsOpen&&this._value[0]&&s.i(this.options,this._value[0])?`${this.id}-listbox-${s.a(this._options,this._value[0])}`:void 0)}
+              aria-description=${n.t(this._selectionDescription||void 0)}
+              ${a.n(this.inputRef)}
+            />
+          </div>
+        `:e._`
+          <input
+            type="hidden"
+            id="${this.id}-input"
+            name=${(this.name||this.id)+`-input`}
+            .value=${this._value.join(`,`)}
+            ${a.n(this.inputRef)}
+          />
+        `}renderSingleOrMultipleValues(){if(!this.multiple&&this._hasTextInput)return e.h;let t=!this.multiple,n=this.renderValueTag(s.i(this.options,this._value[0])),r=this.tagPlacement===`outside`,i=e._`
+      <ul role="list" class="pkt-combobox__tag-list">
+        ${o.t(this._value,e=>e,(t,n)=>{let i=s.i(this.options,t),a=i?.tagSkinColor;return e._`
+              <li
+                role="listitem"
+                @click=${r?e.h:e=>e.stopPropagation()}
+                @mousedown=${r?e.h:e=>e.preventDefault()}
+              >
+                <pkt-tag
+                  skin=${a||`blue-dark`}
+                  ?closeTag=${!this.disabled}
+                  .buttonTabindex=${r?void 0:-1}
+                  @close=${()=>this.handleTagRemove(t)}
+                  @keydown=${r?e.h:e=>this.handleTagKeydown(e,n)}
+                >
+                  ${this.renderValueTag(i)}
+                </pkt-tag>
+              </li>
+            `})}
+      </ul>
+    `;return!t&&this._value.length===0?e.h:t?n:i}renderValueTag(t){if(!t)return``;switch(this.displayValueAs){case`prefixAndValue`:return e._`<span class="pkt-combobox__value">${t.prefix||``} ${t.value}</span>`;case`value`:return e._`<span class="pkt-combobox__value">${t.value}</span>`;default:return e._`<span class="pkt-combobox__value">${t.label||t.value}</span>`}}};try{e.d(`pkt-combobox`)(x)}catch{console.warn(`Forsøker å definere <pkt-combobox>, men den er allerede definert`)}var S=x;Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return S}});

package/dist/{combobox-Cqqokx73.js → combobox-fzSaCPok.js}

@@ -8,7 +8,7 @@ import { n as u, t as d } from "./ref-DNowxdYH.js";
 import "./tag-bztxjcF0.js";
 import { t as f } from "./repeat-CZ1oMXnW.js";
 import { a as p, c as m, i as h, l as g, o as _, r as v, s as y } from "./listbox-CrQboPG6.js";
-import { t as b } from "./input-element-Qb0w3ChW.js";
+import { t as b } from "./input-element-BWxgs8L-.js";
 import { t as x } from "./pkt-options-controller-XcIgx_v1.js";
 import "./input-wrapper-Bg06k-cj.js";
 //#region ../../shared-utils/combobox/input-utils.ts
@@ -120,6 +120,13 @@ var S = (e, t, n) => {
 			description: "Navn som brukes i skjema ved innsending",
 			category: "tech"
 		},
+		form: {
+			name: "Skjema",
+			description: "ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet",
+			type: "string",
+			required: !1,
+			category: "tech"
+		},
 		id: {
 			type: "string",
 			name: "ID",

package/dist/components/fileupload/fileupload-base.d.ts

@@ -6,6 +6,7 @@ export declare abstract class PktFileUploadBase extends PktElement<IPktFileUploa
     id: string;
     /** Field name used by native input (`form`) or hidden fileId inputs (`custom`). */
     name: string;
+    form?: string;
     /** Optional label shown by `pkt-input-wrapper`. */
     label: string;
     /** Optional help text shown under label. */
@@ -123,6 +124,7 @@ export declare abstract class PktFileUploadBase extends PktElement<IPktFileUploa
     protected getSrUploadedMessage(): string;
     /** Assertive summary for transfer errors (parity with React `FileUpload`). */
     protected getSrErrorsMessage(): string;
+    protected get ownerForm(): HTMLFormElement | null;
     private syncFormSubmitListener;
     private teardownFormSubmitListener;
     private onHostFormSubmit;

package/dist/{datepicker-BzRhOIkG.cjs → datepicker-D6os8IVu.cjs}

@@ -1,4 +1,4 @@
-const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),n=require("./if-defined-BbUZeoaQ.cjs"),r=require("./element-with-slot-C66Jck5e.cjs");require("./icon-BzxBkRyE.cjs");const i=require("./ref-AuNEkS5a.cjs"),a=require("./converters-BJ9Fe0kW.cjs");require("./calendar-CAwIY7x_.cjs"),require("./tag-CGlxtBOH.cjs");const o=require("./repeat-B3ksuY2F.cjs"),s=require("./utils-63cRpWut.cjs"),c=require("./input-element-DhIEFeuP.cjs");require("./input-wrapper-D64Qn-QH.cjs");var l=class extends e.t{constructor(...e){super(...e),this.dates=[],this.dateformat=`dd.MM.yyyy`,this.className=`pkt-datepicker__tags`,this.idBase=s.n()}render(){return this.classes={"pkt-date-tags":!0,[this.className]:!0},e._`
+const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),n=require("./if-defined-BbUZeoaQ.cjs"),r=require("./element-with-slot-C66Jck5e.cjs");require("./icon-BzxBkRyE.cjs");const i=require("./ref-AuNEkS5a.cjs"),a=require("./converters-BJ9Fe0kW.cjs");require("./calendar-CAwIY7x_.cjs"),require("./tag-CGlxtBOH.cjs");const o=require("./repeat-B3ksuY2F.cjs"),s=require("./utils-63cRpWut.cjs"),c=require("./input-element-PN5nWd1A.cjs");require("./input-wrapper-D64Qn-QH.cjs");var l=class extends e.t{constructor(...e){super(...e),this.dates=[],this.dateformat=`dd.MM.yyyy`,this.className=`pkt-datepicker__tags`,this.idBase=s.n()}render(){return this.classes={"pkt-date-tags":!0,[this.className]:!0},e._`
       <div class=${t.t(this.classes)} aria-live="polite">
         ${Array.isArray(this.dates)&&this.dates[0]?o.t(a.h((this.dates??[]).filter(Boolean)),e=>e,t=>e._` <pkt-tag
                   id=${this.idBase+t+`-tag`}
@@ -9,7 +9,7 @@ const e=require("./element-D_mCyFeX.cjs"),t=require("./class-map-DupQbnhE.cjs"),
                   <time datetime=${t}>${a.c(t,this.dateformat)}</time>
                 </pkt-tag>`):e.h}
       </div>
-    `}};e.n([e.u({type:Array})],l.prototype,`dates`,void 0),e.n([e.u({type:String})],l.prototype,`dateformat`,void 0),e.n([e.u({type:String,attribute:`class`})],l.prototype,`className`,void 0),e.n([e.u({type:String,attribute:`id-base`})],l.prototype,`idBase`,void 0);try{e.d(`pkt-date-tags`)(l)}catch{console.warn(`Forsøker å definere <pkt-date-tags>, men den er allerede definert`)}var u={name:`pkt-datepicker`,react:`PktDatepicker`,"css-class":`pkt-datepicker`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn for innsending`,category:`tech`},label:{type:`string`,name:`Tekst/label`,category:`contents`},helptext:{type:`string`,name:`Hjelpetekst`,category:`contents`},helptextDropdown:{type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{type:`string`,name:`Knappetekst for utvidet hjelpetekst`,default:`Les mer`,category:`contents`},dateformat:{name:`Datoformat for tags i flervalg`,type:`string`,default:`dd.MM.yyyy`,category:`tech`},currentmonth:{name:`Måned som vises i datovelgeren`,type:`ISOdatestring`,category:`tech`},value:{name:`Verdi (kommaseparert ved flervalg)`,type:`ISOdatestring`,variant:`multiple`,category:`tech`},excludeweekdays:{name:`Utelat ukedager`,type:`string`,description:`Kommaseparert liste over ukedager (1-7) som skal ekskluderes`,category:`functionality`},excludedates:{name:`Utelat datoer (Kommaseparerte ISO-datoer)`,type:`ISOdatestring`,variant:`multiple`,category:`functionality`},min:{name:`Tidligst tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},max:{name:`Senest tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},weeknumbers:{name:`Vis ukenummer`,type:`boolean`,reflect:!0,default:!1,category:`ui`},withcontrols:{name:`Med velgere for måned/år`,type:`boolean`,reflect:!0,default:!1,category:`ui`},multiple:{name:`Flervalg`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},maxlength:{name:`Maks antall datoer i flervalg`,type:`number`,category:`functionality`,showIf:{multiple:!0}},range:{name:`Datotidsrom (fra og til)`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},showRangeLabels:{attribute:`show-range-labels`,name:`Vis fra/til-etiketter`,type:`boolean`,default:!1,category:`ui`,showIf:{range:!0}},today:{name:`Dagens dato (overstyring)`,type:`ISOdatestring`,description:`ISO-datostreng som overstyrer dagens dato i kalenderen. Nyttig for snapshot-tester.`,category:`tech`},calendarOpen:{attribute:`calendar-open`,name:`Kalender åpen`,type:`boolean`,reflect:!0,default:!1,category:`ui`},hasError:{type:`boolean`,name:`Feil`,default:!1,category:`ui`},errorMessage:{type:`string`,name:`Feilmelding ved feil`,category:`contents`},disabled:{type:`boolean`,name:`Deaktivert`,default:!1,reflect:!0,category:`tech`},fullwidth:{type:`boolean`,name:`Full bredde`,default:!1,reflect:!0,category:`ui`},inputSize:{attribute:`input-size`,name:`Størrelse`,description:`Størrelsen på komponenten`,type:[`medium`,`small`,`xsmall`],default:`medium`,category:`ui`},required:{type:`boolean`,name:`Påkrevd`,default:!1,reflect:!0,category:`tech`},requiredTag:{type:`boolean`,name:`Vise påkrevd-merking`,default:!1,category:`ui`},requiredText:{type:`string`,name:`Påkrevd-tekst`,default:`Må fylles ut`,category:`contents`},optionalTag:{type:`boolean`,name:`Vise valgfritt-merking`,default:!1,category:`ui`},optionalText:{type:`string`,name:`Valgfritt-tekst`,default:`Valgfritt`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},useWrapper:{type:`boolean`,name:`Bruk wrapper`,description:`Indikerer at feltet skal ha synlig label og hjelpetekst`,displayAsFalse:!0,default:!0,category:`ui`},id:{type:`string`,name:`ID`,description:`Unik identifikasjon for datovelgeren`,category:`tech`},ariaDescribedby:{attribute:`aria-describedby`,name:`aria-describedby`,description:`Spesifiserer ID-en til elementet som beskriver feltet.`,type:`string`,category:`accessibility`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},hasFieldset:{name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet består av flere kontroller.`,category:`ui`},counter:{name:`Teller`,type:`boolean`,required:!1,default:null,description:`Viser teller under feltet. Slås på av seg selv når det finnes en grense å telle mot; sett til false for å skru den av.`,category:`ui`}},events:{change:{type:`Event`,name:`change (Elements)`,description:`Returnerer valgt dato som streng i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},"value-change":{type:`CustomEvent`,name:`value-change (Elements)`,description:`Returnerer en <code>array</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`},onChange:{type:`Event`,name:`onChange (React)`,reactOnly:!0,description:`Utløses når en dato velges. <code>e.target.value</code> inneholder kommaseparerte ISO-datoer. I range-modus utløses kun når begge datoer er valgt.`},onValueChange:{type:`string[]`,name:`onValueChange (React)`,reactOnly:!0,description:`Returnerer en <code>string[]</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`}}},d=()=>{let e=navigator.userAgent;return!!(/iP(hone|od|ad)/.test(e)||/Macintosh/.test(e)&&`ontouchend`in document)},f=()=>d()?`text`:`date`,p=e=>!e||e.length!==2||a.u(e[0],e[1]),m=e=>a.h(e),h=(e,t,n,r,i)=>a.i(e,t,n,r,i),g=(e,t,n,r,i,a,o=`medium`)=>({"pkt-input":!0,"pkt-datepicker__input":!0,[`pkt-input--${o}`]:!0,"pkt-input--fullwidth":e,"pkt-datepicker--hasrangelabels":t,"pkt-datepicker--multiple":n,"pkt-datepicker--range":r,"ios-readonly-hack":i===!1&&a===`text`}),_=(e=`medium`)=>({"pkt-input-icon":!0,"pkt-btn":!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":!0,[`pkt-btn--${e}`]:!0,"pkt-datepicker__calendar-button":!0}),v=e=>({"pkt-input-prefix":e,"pkt-hide":!e}),y=(e,t,n)=>!t&&!n?Array.isArray(e)?e[0]||``:e:Array.isArray(e)?e.join(`,`):e,b=(e,t,n=!1)=>{if(!e||!t)return;let r=t.parentElement?.getBoundingClientRect()||t.getBoundingClientRect(),i=n?r.height+30:r.height,a=e.getBoundingClientRect().height,o=n?`calc(100% - 30px)`:`100%`;r&&typeof window<`u`&&r.top+a>window.innerHeight&&r.top-a>0&&(o=`calc(100% - ${i}px - ${a}px)`),e.style.top=o},x=(e,t,n,r,i,a)=>{let{key:o}=e;o===`,`&&(e.preventDefault(),a?a(e):i&&i()),(o===`Space`||o===` `)&&(e.preventDefault(),t(e)),o===`Enter`&&(e.preventDefault(),n?n():r?r():i&&i())},S=(e,t)=>{let{key:n}=e;(n===`Enter`||n===` `||n===`Space`)&&(e.preventDefault(),t(e))},C={validateRangeOrder:p,sortDates:m,filterSelectableDates:h},w={getInputType:f},T={submitForm(e){let t=e.internals?.form;t&&t.requestSubmit()},submitFormOrFallback(e,t){let n=e?.form;n?n.requestSubmit():t()},validateDateInput(t,n,r,i,a){let o=t.value;if(!o)return;let s={...e.s.validation,...a};r&&r>o?n.setValidity({rangeUnderflow:!0},s.dateUnderflow,t):i&&i<o&&n.setValidity({rangeOverflow:!0},s.dateOverflow,t)}},E={addToSelected(e,t,n,r){let i=e.target;if(!i.value)return;let o=n?a.d(n):null,s=r?a.d(r):null,c=a.d(i.value.split(`,`)[0]);c&&!isNaN(c.getTime())&&(!o||c>=o)&&(!s||c<=s)&&t.value&&t.value.handleDateSelect(c),i.value=``},handleCalendarPosition(e,t,n=!1){b(e.value??null,t.value??null,n)}},D={getInputClasses:g,getButtonClasses:_,getRangeLabelClasses:v},O={processDateSelection:y,updateInputValues(e,t,n,r,i,a){e.value&&(r&&t?.value?(e.value.value=n[0]??``,t.value.value=n[1]??``,a(e.value),a(t.value)):i||(e.value.value=n.length?n[0]:``,a(e.value)))},processRangeBlur(e,t,n,r,i){let o=e.target;if(o.value){i(o);let e=a.s(o.value);e&&n?.value?.handleDateSelect(e)}else t[0]&&r()}},k={handleInputKeydown:x,handleButtonKeydown:S},A=class extends e.t{constructor(...e){super(...e),this.open=!1,this.multiple=!1,this.range=!1,this.weeknumbers=!1,this.withcontrols=!1,this.maxMultiple=null,this.selected=[],this.earliest=null,this.latest=null,this.excludedates=[],this.excludeweekdays=[],this.currentmonth=null,this.today=null,this._hasBeenOpened=!1,this.popupRef=i.t(),this.calendarRef=i.t(),this.handleDocumentClick=e=>{if(!this.open)return;let t=e.composedPath(),n=this.parentElement,r=this.popupRef.value;!t.includes(this)&&!t.includes(r)&&!(n&&t.includes(n))&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))},this.handleDocumentKeydown=e=>{this.open&&e.key===`Escape`&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))}}firstUpdated(){this.calRef=this.calendarRef}updated(e){super.updated(e),e.has(`open`)&&(this.open?(this._hasBeenOpened=!0,document.addEventListener(`keydown`,this.handleDocumentKeydown),document.addEventListener(`click`,this.handleDocumentClick)):(document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)}show(){this.open=!0,this.calendarRef.value?.focus()}hide(){this.open=!1}toggle(){this.open?this.hide():this.show()}contains(e){return!!e&&!!this.popupRef.value?.contains(e)}focusOnCurrentDate(){let e=this.calendarRef.value;e&&typeof e.focusOnCurrentDate==`function`&&e.focusOnCurrentDate()}addToSelected(e,t,n){if(this.calendarRef.value&&typeof E.addToSelected==`function`)return E.addToSelected(e,this.calendarRef,t,n);let r=e.target;if(!r.value)return;let i=t?a.d(t):null,o=n?a.d(n):null,s=a.d(r.value.split(`,`)[0]);s&&!isNaN(s.getTime())&&(!i||s>=i)&&(!o||s<=o)&&this.handleDateSelect(s),r.value=``}handleDateSelect(e){let t=this.calendarRef.value;if(t&&typeof t.handleDateSelect==`function`)return t.handleDateSelect(e);let n=a.a(e),r=this.selected.indexOf(n)>=0?this.selected.filter(e=>e!==n):[...this.selected,n];this.selected=r,this.dispatchEvent(new CustomEvent(`date-selected`,{detail:r,bubbles:!0,composed:!0}))}render(){let n={"pkt-calendar-popup":!0,show:this.open,hide:!this.open};return e._`
+    `}};e.n([e.u({type:Array})],l.prototype,`dates`,void 0),e.n([e.u({type:String})],l.prototype,`dateformat`,void 0),e.n([e.u({type:String,attribute:`class`})],l.prototype,`className`,void 0),e.n([e.u({type:String,attribute:`id-base`})],l.prototype,`idBase`,void 0);try{e.d(`pkt-date-tags`)(l)}catch{console.warn(`Forsøker å definere <pkt-date-tags>, men den er allerede definert`)}var u={name:`pkt-datepicker`,react:`PktDatepicker`,"css-class":`pkt-datepicker`,isElement:!0,isPureReact:!0,"dark-mode":!0,props:{name:{type:`string`,name:`Navn for innsending`,category:`tech`},form:{name:`Skjema`,description:`ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet`,type:`string`,required:!1,category:`tech`},label:{type:`string`,name:`Tekst/label`,category:`contents`},helptext:{type:`string`,name:`Hjelpetekst`,category:`contents`},helptextDropdown:{type:`string`,name:`Utvidet hjelpetekst`,description:`Hjelpetekst som vises i en lukket boks man kan åpne`,category:`contents`},helptextDropdownButton:{type:`string`,name:`Knappetekst for utvidet hjelpetekst`,default:`Les mer`,category:`contents`},dateformat:{name:`Datoformat for tags i flervalg`,type:`string`,default:`dd.MM.yyyy`,category:`tech`},currentmonth:{name:`Måned som vises i datovelgeren`,type:`ISOdatestring`,category:`tech`},value:{name:`Verdi (kommaseparert ved flervalg)`,type:`ISOdatestring`,variant:`multiple`,category:`tech`},excludeweekdays:{name:`Utelat ukedager`,type:`string`,description:`Kommaseparert liste over ukedager (1-7) som skal ekskluderes`,category:`functionality`},excludedates:{name:`Utelat datoer (Kommaseparerte ISO-datoer)`,type:`ISOdatestring`,variant:`multiple`,category:`functionality`},min:{name:`Tidligst tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},max:{name:`Senest tillatte dato`,type:`ISOdatestring`,default:null,category:`functionality`},weeknumbers:{name:`Vis ukenummer`,type:`boolean`,reflect:!0,default:!1,category:`ui`},withcontrols:{name:`Med velgere for måned/år`,type:`boolean`,reflect:!0,default:!1,category:`ui`},multiple:{name:`Flervalg`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},maxlength:{name:`Maks antall datoer i flervalg`,type:`number`,category:`functionality`,showIf:{multiple:!0}},range:{name:`Datotidsrom (fra og til)`,type:`boolean`,reflect:!0,default:!1,category:`functionality`},showRangeLabels:{attribute:`show-range-labels`,name:`Vis fra/til-etiketter`,type:`boolean`,default:!1,category:`ui`,showIf:{range:!0}},today:{name:`Dagens dato (overstyring)`,type:`ISOdatestring`,description:`ISO-datostreng som overstyrer dagens dato i kalenderen. Nyttig for snapshot-tester.`,category:`tech`},calendarOpen:{attribute:`calendar-open`,name:`Kalender åpen`,type:`boolean`,reflect:!0,default:!1,category:`ui`},hasError:{type:`boolean`,name:`Feil`,default:!1,category:`ui`},errorMessage:{type:`string`,name:`Feilmelding ved feil`,category:`contents`},disabled:{type:`boolean`,name:`Deaktivert`,default:!1,reflect:!0,category:`tech`},fullwidth:{type:`boolean`,name:`Full bredde`,default:!1,reflect:!0,category:`ui`},inputSize:{attribute:`input-size`,name:`Størrelse`,description:`Størrelsen på komponenten`,type:[`medium`,`small`,`xsmall`],default:`medium`,category:`ui`},required:{type:`boolean`,name:`Påkrevd`,default:!1,reflect:!0,category:`tech`},requiredTag:{type:`boolean`,name:`Vise påkrevd-merking`,default:!1,category:`ui`},requiredText:{type:`string`,name:`Påkrevd-tekst`,default:`Må fylles ut`,category:`contents`},optionalTag:{type:`boolean`,name:`Vise valgfritt-merking`,default:!1,category:`ui`},optionalText:{type:`string`,name:`Valgfritt-tekst`,default:`Valgfritt`,category:`contents`},tagText:{type:`string`,name:`Tag-tekst`,description:`Tekst som vises i en tag ved siden av label`,category:`ui`},useWrapper:{type:`boolean`,name:`Bruk wrapper`,description:`Indikerer at feltet skal ha synlig label og hjelpetekst`,displayAsFalse:!0,default:!0,category:`ui`},id:{type:`string`,name:`ID`,description:`Unik identifikasjon for datovelgeren`,category:`tech`},ariaDescribedby:{attribute:`aria-describedby`,name:`aria-describedby`,description:`Spesifiserer ID-en til elementet som beskriver feltet.`,type:`string`,category:`accessibility`},inline:{name:`Inline`,type:`boolean`,required:!1,default:!1,description:`Angir om feltet skal flyte med teksten`,category:`ui`},hasFieldset:{name:`Bruk fieldset`,type:`boolean`,required:!1,default:null,description:`Bruk fieldset og legend i stedet for label. Utledes automatisk når feltet består av flere kontroller.`,category:`ui`},counter:{name:`Teller`,type:`boolean`,required:!1,default:null,description:`Viser teller under feltet. Slås på av seg selv når det finnes en grense å telle mot; sett til false for å skru den av.`,category:`ui`}},events:{change:{type:`Event`,name:`change (Elements)`,description:`Returnerer valgt dato som streng i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},"value-change":{type:`CustomEvent`,name:`value-change (Elements)`,description:`Returnerer en <code>array</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`},toggleHelpText:{type:`CustomEvent`,description:`Returnerer <code>event.detail { isOpen: true }</code> eller <code>event.detail { isOpen: false }</code> når hjelpeteksten åpnes eller lukkes`},onChange:{type:`Event`,name:`onChange (React)`,reactOnly:!0,description:`Utløses når en dato velges. <code>e.target.value</code> inneholder kommaseparerte ISO-datoer. I range-modus utløses kun når begge datoer er valgt.`},onValueChange:{type:`string[]`,name:`onValueChange (React)`,reactOnly:!0,description:`Returnerer en <code>string[]</code> med valgte datoer i ISO-format. I range-modus utløses kun når begge datoer er valgt.`}}},d=()=>{let e=navigator.userAgent;return!!(/iP(hone|od|ad)/.test(e)||/Macintosh/.test(e)&&`ontouchend`in document)},f=()=>d()?`text`:`date`,p=e=>!e||e.length!==2||a.u(e[0],e[1]),m=e=>a.h(e),h=(e,t,n,r,i)=>a.i(e,t,n,r,i),g=(e,t,n,r,i,a,o=`medium`)=>({"pkt-input":!0,"pkt-datepicker__input":!0,[`pkt-input--${o}`]:!0,"pkt-input--fullwidth":e,"pkt-datepicker--hasrangelabels":t,"pkt-datepicker--multiple":n,"pkt-datepicker--range":r,"ios-readonly-hack":i===!1&&a===`text`}),_=(e=`medium`)=>({"pkt-input-icon":!0,"pkt-btn":!0,"pkt-btn--icon-only":!0,"pkt-btn--tertiary":!0,[`pkt-btn--${e}`]:!0,"pkt-datepicker__calendar-button":!0}),v=e=>({"pkt-input-prefix":e,"pkt-hide":!e}),y=(e,t,n)=>!t&&!n?Array.isArray(e)?e[0]||``:e:Array.isArray(e)?e.join(`,`):e,b=(e,t,n=!1)=>{if(!e||!t)return;let r=t.parentElement?.getBoundingClientRect()||t.getBoundingClientRect(),i=n?r.height+30:r.height,a=e.getBoundingClientRect().height,o=n?`calc(100% - 30px)`:`100%`;r&&typeof window<`u`&&r.top+a>window.innerHeight&&r.top-a>0&&(o=`calc(100% - ${i}px - ${a}px)`),e.style.top=o},x=(e,t,n,r,i,a)=>{let{key:o}=e;o===`,`&&(e.preventDefault(),a?a(e):i&&i()),(o===`Space`||o===` `)&&(e.preventDefault(),t(e)),o===`Enter`&&(e.preventDefault(),n?n():r?r():i&&i())},S=(e,t)=>{let{key:n}=e;(n===`Enter`||n===` `||n===`Space`)&&(e.preventDefault(),t(e))},C={validateRangeOrder:p,sortDates:m,filterSelectableDates:h},w={getInputType:f},T={submitForm(e){let t=e.internals?.form;t&&t.requestSubmit()},submitFormOrFallback(e,t){let n=e?.form;n?n.requestSubmit():t()},validateDateInput(t,n,r,i,a){let o=t.value;if(!o)return;let s={...e.s.validation,...a};r&&r>o?n.setValidity({rangeUnderflow:!0},s.dateUnderflow,t):i&&i<o&&n.setValidity({rangeOverflow:!0},s.dateOverflow,t)}},E={addToSelected(e,t,n,r){let i=e.target;if(!i.value)return;let o=n?a.d(n):null,s=r?a.d(r):null,c=a.d(i.value.split(`,`)[0]);c&&!isNaN(c.getTime())&&(!o||c>=o)&&(!s||c<=s)&&t.value&&t.value.handleDateSelect(c),i.value=``},handleCalendarPosition(e,t,n=!1){b(e.value??null,t.value??null,n)}},D={getInputClasses:g,getButtonClasses:_,getRangeLabelClasses:v},O={processDateSelection:y,updateInputValues(e,t,n,r,i,a){e.value&&(r&&t?.value?(e.value.value=n[0]??``,t.value.value=n[1]??``,a(e.value),a(t.value)):i||(e.value.value=n.length?n[0]:``,a(e.value)))},processRangeBlur(e,t,n,r,i){let o=e.target;if(o.value){i(o);let e=a.s(o.value);e&&n?.value?.handleDateSelect(e)}else t[0]&&r()}},k={handleInputKeydown:x,handleButtonKeydown:S},A=class extends e.t{constructor(...e){super(...e),this.open=!1,this.multiple=!1,this.range=!1,this.weeknumbers=!1,this.withcontrols=!1,this.maxMultiple=null,this.selected=[],this.earliest=null,this.latest=null,this.excludedates=[],this.excludeweekdays=[],this.currentmonth=null,this.today=null,this._hasBeenOpened=!1,this.popupRef=i.t(),this.calendarRef=i.t(),this.handleDocumentClick=e=>{if(!this.open)return;let t=e.composedPath(),n=this.parentElement,r=this.popupRef.value;!t.includes(this)&&!t.includes(r)&&!(n&&t.includes(n))&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))},this.handleDocumentKeydown=e=>{this.open&&e.key===`Escape`&&(this.hide(),this.dispatchEvent(new CustomEvent(`close`,{bubbles:!0,composed:!0})))}}firstUpdated(){this.calRef=this.calendarRef}updated(e){super.updated(e),e.has(`open`)&&(this.open?(this._hasBeenOpened=!0,document.addEventListener(`keydown`,this.handleDocumentKeydown),document.addEventListener(`click`,this.handleDocumentClick)):(document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`click`,this.handleDocumentClick),document.removeEventListener(`keydown`,this.handleDocumentKeydown)}show(){this.open=!0,this.calendarRef.value?.focus()}hide(){this.open=!1}toggle(){this.open?this.hide():this.show()}contains(e){return!!e&&!!this.popupRef.value?.contains(e)}focusOnCurrentDate(){let e=this.calendarRef.value;e&&typeof e.focusOnCurrentDate==`function`&&e.focusOnCurrentDate()}addToSelected(e,t,n){if(this.calendarRef.value&&typeof E.addToSelected==`function`)return E.addToSelected(e,this.calendarRef,t,n);let r=e.target;if(!r.value)return;let i=t?a.d(t):null,o=n?a.d(n):null,s=a.d(r.value.split(`,`)[0]);s&&!isNaN(s.getTime())&&(!i||s>=i)&&(!o||s<=o)&&this.handleDateSelect(s),r.value=``}handleDateSelect(e){let t=this.calendarRef.value;if(t&&typeof t.handleDateSelect==`function`)return t.handleDateSelect(e);let n=a.a(e),r=this.selected.indexOf(n)>=0?this.selected.filter(e=>e!==n):[...this.selected,n];this.selected=r,this.dispatchEvent(new CustomEvent(`date-selected`,{detail:r,bubbles:!0,composed:!0}))}render(){let n={"pkt-calendar-popup":!0,show:this.open,hide:!this.open};return e._`
       <div
         class="${t.t(n)}"
         ${i.n(this.popupRef)}

package/dist/{datepicker-CtSYgxMs.js → datepicker-DMiZ3BBw.js}

@@ -9,7 +9,7 @@ import "./calendar-42o_q-jI.js";
 import "./tag-bztxjcF0.js";
 import { t as C } from "./repeat-CZ1oMXnW.js";
 import { n as w, t as T } from "./utils-BwF4QSrq.js";
-import { t as E } from "./input-element-Qb0w3ChW.js";
+import { t as E } from "./input-element-BWxgs8L-.js";
 import "./input-wrapper-Bg06k-cj.js";
 //#region src/components/datepicker/date-tags.ts
 var D = class extends o {
@@ -61,6 +61,13 @@ var O = {
 			name: "Navn for innsending",
 			category: "tech"
 		},
+		form: {
+			name: "Skjema",
+			description: "ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet",
+			type: "string",
+			required: !1,
+			category: "tech"
+		},
 		label: {
 			type: "string",
 			name: "Tekst/label",

package/dist/docs/components/switch.d.ts

@@ -0,0 +1,4 @@
+import { PktElement } from '../../base-elements/element';
+export declare class Switch extends PktElement {
+    render(): import('lit-html').TemplateResult<1>;
+}

package/dist/{fileupload-PJWEBD88.js → fileupload-C5lxuood.js}

@@ -206,7 +206,7 @@ var j = class extends a {
 		super.willUpdate(e), this.hasInitializedValue && this.isControlled && (e.has("value") || e.has("itemRenderer") || e.has("enableImagePreview")) && (this.files = this.value ?? [], this.syncThumbnailUrls(this.files));
 	}
 	updated(e) {
-		super.updated(e), (e.has("uploadStrategy") || e.has("required") || e.has("value")) && this.syncFormSubmitListener(), this.uploadStrategy === "form" && (e.has("value") || e.has("files") || e.has("uploadStrategy")) && this.syncNativeInputFiles();
+		super.updated(e), (e.has("uploadStrategy") || e.has("required") || e.has("value") || e.has("form")) && this.syncFormSubmitListener(), this.uploadStrategy === "form" && (e.has("value") || e.has("files") || e.has("uploadStrategy")) && this.syncNativeInputFiles();
 	}
 	syncNativeInputFiles() {
 		let e = this.querySelector(`#${this.id}-input`);
@@ -395,15 +395,26 @@ var j = class extends a {
 			label: l(e, n.fileLabelOne, n.fileLabelOther)
 		});
 	}
+	get ownerForm() {
+		if (this.form !== void 0) {
+			if (!this.form) return null;
+			let e = this.ownerDocument?.getElementById(this.form);
+			return e instanceof HTMLFormElement ? e : null;
+		}
+		return this.closest("form");
+	}
 	syncFormSubmitListener() {
-		let e = this.closest("form");
+		let e = this.ownerForm;
 		this.connectedForm !== e && (this.teardownFormSubmitListener(), this.connectedForm = e, this.connectedForm && this.connectedForm.addEventListener("submit", this.onHostFormSubmit));
 	}
 	teardownFormSubmitListener() {
 		this.connectedForm &&= (this.connectedForm.removeEventListener("submit", this.onHostFormSubmit), null);
 	}
 };
-r([o({ type: String })], j.prototype, "id", void 0), r([o({ type: String })], j.prototype, "name", void 0), r([o({ type: String })], j.prototype, "label", void 0), r([o({ type: String })], j.prototype, "helptext", void 0), r([o({
+r([o({ type: String })], j.prototype, "id", void 0), r([o({ type: String })], j.prototype, "name", void 0), r([o({
+	type: String,
+	reflect: !0
+})], j.prototype, "form", void 0), r([o({ type: String })], j.prototype, "label", void 0), r([o({ type: String })], j.prototype, "helptext", void 0), r([o({
 	type: String,
 	attribute: "helptext-dropdown"
 })], j.prototype, "helptextDropdown", void 0), r([o({
@@ -1140,6 +1151,7 @@ var M = "comments", N = (e) => {
             id=${`${this.id}-input`}
             type="file"
             name=${c(this.uploadStrategy === "form" ? this.name : void 0)}
+            form=${c(this.form)}
             ?multiple=${this.multiple}
             ?disabled=${this.disabled}
             ?required=${this.required && this.uploadStrategy === "form"}
@@ -1150,7 +1162,12 @@ var M = "comments", N = (e) => {
             aria-describedby=${c(a)}
             @change=${this.onNativeFileChange}
           />
-          ${this.uploadStrategy === "custom" ? t.map((t) => e`<input type="hidden" name=${this.name} value=${t.fileId} />`) : null}
+          ${this.uploadStrategy === "custom" ? t.map((t) => e`<input
+                    type="hidden"
+                    name=${this.name}
+                    value=${t.fileId}
+                    form=${c(this.form)}
+                  />`) : null}
           <div class="pkt-fileupload__drop-zone__placeholder">
             <pkt-icon
               name="attachment"