@oslokommune/punkt-elements 12.40.10 → 12.41.1

package/dist/{combobox-lds6Lryq.cjs → combobox-DMkMUJfx.cjs}

@@ -1,4 +1,4 @@
-"use strict";const l=require("./element-90YeMNbV.cjs"),c=require("./if-defined-C8eotHpL.cjs"),d=require("./state-D-Recv7U.cjs"),r=require("./ref-B-w1vCo8.cjs"),I=require("./class-map-DWDPOqjO.cjs"),$=require("./repeat-CxQA3AeF.cjs"),w=require("./input-element-CInrWeac.cjs"),O=require("./pkt-options-controller-Ay9ELZTV.cjs"),y=require("./pkt-slot-controller-Da-RgXfS.cjs");require("./input-wrapper-B_TtkGqo.cjs");require("./icon-B1_BRNqf.cjs");require("./tag-lU4vz70a.cjs");require("./listbox-AjDNhDsQ.cjs");const C={displayValueAs:{default:"label"}},R={props:C};var V=Object.defineProperty,S=Object.getOwnPropertyDescriptor,a=(b,e,t,i)=>{for(var s=i>1?void 0:i?S(e,t):e,n=b.length-1,u;n>=0;n--)(u=b[n])&&(s=(i?u(e,t,s):u(s))||s);return i&&s&&V(e,t,s),s};exports.PktCombobox=class extends w.PktInputElement{constructor(){super(),this.helptextSlot=r.e(),this.value="",this.options=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder="",this.multiple=!1,this.maxlength=null,this.displayValueAs=R.props.displayValueAs.default,this.tagPlacement=null,this._options=[],this._isOptionsOpen=!1,this._value=[],this._userInfoMessage="",this._addValueText=null,this._maxIsReached=!1,this._search="",this._inputFocus=!1,this._editingSingleValue=!1,this.inputRef=r.e(),this.arrowRef=r.e(),this.listboxRef=r.e(),this.focusRef=r.e(),this.optionTagRef=r.e(),this.optionsController=new O.PktOptionsSlotController(this),this.slotController=new y.PktSlotController(this,this.helptextSlot),this.slotController.skipOptions=!0}connectedCallback(){if(super.connectedCallback(),document&&document.body.addEventListener("click",e=>{this._isOptionsOpen&&!this.contains(e.target)&&this.handleFocusOut(e)}),this._options=[],this.optionsController.nodes.length){const e=[];this.optionsController.nodes.forEach(t=>{if(!t.textContent&&!t.getAttribute("value"))return null;const i={value:t.getAttribute("value")||t.textContent||"",label:t.textContent||t.getAttribute("value")||""};t.getAttribute("data-prefix")&&(i.prefix=t.getAttribute("data-prefix")||void 0),t.getAttribute("tagskincolor")&&(i.tagSkinColor=t.getAttribute("tagskincolor")),t.getAttribute("description")&&(i.description=t.getAttribute("description")||void 0),i.fulltext=i.value+i.label+(i.prefix||""),e.push(i)}),e.length&&(this.options=[...e],this._options=[...e])}}updated(e){e.has("_value")&&this.valueChanged(this._value,e.get("_value")),e.has("value")&&(this._value=Array.isArray(this.value)?this.value:this.value?this.value.split(","):[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]]),this.isMaxItemsReached()),e.has("options")&&this.options.length&&(this._options=this.options,this._options.forEach(t=>{if(t.value&&!t.label&&(t.label=t.value),t.selected&&!this._value.includes(t.value)){const i=[...this._value];this._value=[...this._value,t.value],this.valueChanged(this._value,i)}t.fulltext=t.value+t.label+(t.prefix||""),t.selected=t.selected||this._value.includes(t.value)})),e.has("_search")&&this.dispatchEvent(new CustomEvent("search",{detail:this._search,bubbles:!1})),super.updated(e)}attributeChangedCallback(e,t,i){e==="value"&&(this._value=Array.isArray(this.value)?this.value:this.value?this.value.split(","):[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]])),e==="options"&&(this._options=this.options,this._options.forEach(s=>{s.value&&!s.label&&(s.label=s.value),s.selected&&!this._value.includes(s.value)&&(this._value=[...this._value,s.value]),s.fulltext=s.value+s.label+(s.prefix||"")}),this._search=""),super.attributeChangedCallback(e,t,i)}render(){return l.x`
+"use strict";const a=require("./element-90YeMNbV.cjs"),c=require("./if-defined-C8eotHpL.cjs"),d=require("./state-D-Recv7U.cjs"),r=require("./ref-B-w1vCo8.cjs"),O=require("./class-map-DWDPOqjO.cjs"),I=require("./repeat-CxQA3AeF.cjs"),$=require("./input-element-CInrWeac.cjs"),y=require("./pkt-options-controller-Ay9ELZTV.cjs"),w=require("./pkt-slot-controller-Da-RgXfS.cjs");require("./input-wrapper-B_TtkGqo.cjs");require("./icon-B1_BRNqf.cjs");require("./tag-lU4vz70a.cjs");require("./listbox-AjDNhDsQ.cjs");const C={displayValueAs:{default:"label"}},R={props:C};var V=Object.defineProperty,S=Object.getOwnPropertyDescriptor,o=(b,e,t,i)=>{for(var s=i>1?void 0:i?S(e,t):e,l=b.length-1,n;l>=0;l--)(n=b[l])&&(s=(i?n(e,t,s):n(s))||s);return i&&s&&V(e,t,s),s};exports.PktCombobox=class extends $.PktInputElement{constructor(){super(),this.helptextSlot=r.e(),this.value="",this.options=[],this.defaultOptions=[],this.allowUserInput=!1,this.typeahead=!1,this.includeSearch=!1,this.searchPlaceholder="",this.multiple=!1,this.maxlength=null,this.displayValueAs=R.props.displayValueAs.default,this.tagPlacement=null,this._options=[],this._isOptionsOpen=!1,this._value=[],this._userInfoMessage="",this._addValueText=null,this._maxIsReached=!1,this._search="",this._inputFocus=!1,this._editingSingleValue=!1,this.inputRef=r.e(),this.arrowRef=r.e(),this.listboxRef=r.e(),this.focusRef=r.e(),this.optionTagRef=r.e(),this.optionsController=new y.PktOptionsSlotController(this),this.slotController=new w.PktSlotController(this,this.helptextSlot),this.slotController.skipOptions=!0}connectedCallback(){var e;if(super.connectedCallback(),document&&document.body.addEventListener("click",t=>{this._isOptionsOpen&&!this.contains(t.target)&&this.handleFocusOut(t)}),this._options=[],this.defaultOptions&&this.defaultOptions.length){const t=((e=this.options)==null?void 0:e.filter(i=>i.userAdded))||[];this.options=[...t,...structuredClone(this.defaultOptions)],this._options=[...this.options]}if(this.optionsController.nodes.length){const t=[];this.optionsController.nodes.forEach(i=>{if(!i.textContent&&!i.getAttribute("value"))return null;const s={value:i.getAttribute("value")||i.textContent||"",label:i.textContent||i.getAttribute("value")||""};i.getAttribute("data-prefix")&&(s.prefix=i.getAttribute("data-prefix")||void 0),i.getAttribute("tagskincolor")&&(s.tagSkinColor=i.getAttribute("tagskincolor")),i.getAttribute("description")&&(s.description=i.getAttribute("description")||void 0),s.fulltext=s.value+s.label+(s.prefix||""),t.push(s)}),t.length&&(this.options=[...t],this._options=[...t])}}updated(e){var t;if(e.has("_value")&&this.valueChanged(this._value,e.get("_value")),e.has("value")&&(this._value=Array.isArray(this.value)?this.value:this.value?this.value.split(","):[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]]),this.isMaxItemsReached()),e.has("defaultOptions")&&this.defaultOptions.length){const i=((t=this.options)==null?void 0:t.filter(s=>s.userAdded))||[];this.options=[...i,...structuredClone(this.defaultOptions)],this._options=[...this.options]}if(e.has("options")&&this.options.length){const s=this._options.filter(l=>l.userAdded).filter(l=>!this.options.some(n=>n.value===l.value));this._options=[...s,...this.options],this._options.forEach(l=>{if(l.value&&!l.label&&(l.label=l.value),l.selected&&!this._value.includes(l.value)){const n=[...this._value];this._value=[...this._value,l.value],this.valueChanged(this._value,n)}l.fulltext=l.value+l.label+(l.prefix||""),l.selected=l.selected||this._value.includes(l.value)})}e.has("_search")&&this.dispatchEvent(new CustomEvent("search",{detail:this._search,bubbles:!1})),super.updated(e)}attributeChangedCallback(e,t,i){e==="value"&&(this._value=Array.isArray(this.value)?this.value:this.value?this.value.split(","):[],!this.multiple&&this._value.length>1&&(this._value=[this._value[0]])),e==="options"&&(this._options=this.options,this._options.forEach(s=>{s.value&&!s.label&&(s.label=s.value),s.selected&&!this._value.includes(s.value)&&(this._value=[...this._value,s.value]),s.fulltext=s.value+s.label+(s.prefix||"")}),this._search=""),super.attributeChangedCallback(e,t,i)}render(){return a.x`
       <pkt-input-wrapper
         .label=${this.label}
         .helptext=${this.helptext}
@@ -21,11 +21,11 @@
         <div class="pkt-contents" ${r.n(this.helptextSlot)} name="helptext" slot="helptext"></div>
         <div class="pkt-combobox" @focusout=${this.handleFocusOut}>
           <div
-            class=${I.e({"pkt-combobox__input":!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})}
+            class=${O.e({"pkt-combobox__input":!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})}
             tabindex="-1"
             @click=${this.handleInputClick}
           >
-            ${this.placeholder&&(!this._value.length||this.multiple&&this.tagPlacement=="outside")&&!this._inputFocus?l.x`<span class="pkt-combobox__placeholder">${this.placeholder}</span>`:this.tagPlacement!=="outside"?this.renderSingleOrMultipleValues():l.E}
+            ${this.placeholder&&(!this._value.length||this.multiple&&this.tagPlacement=="outside")&&!this._inputFocus?a.x`<span class="pkt-combobox__placeholder">${this.placeholder}</span>`:this.tagPlacement!=="outside"?this.renderSingleOrMultipleValues():a.E}
             ${this.renderInputField()}
             <div
               class="pkt-btn pkt-btn--tertiary pkt-combobox__arrow"
@@ -43,7 +43,7 @@
               tabindex="${this.disabled?"-1":"0"}"
             >
               <pkt-icon
-                class=${I.e({"pkt-combobox__arrow-icon":!0,"pkt-combobox__arrow-icon--open":this._isOptionsOpen})}
+                class=${O.e({"pkt-combobox__arrow-icon":!0,"pkt-combobox__arrow-icon--open":this._isOptionsOpen})}
                 name="chevron-thin-down"
               ></pkt-icon>
             </div>
@@ -72,11 +72,11 @@
           ></pkt-listbox>
         </div>
 
-        ${this.tagPlacement==="outside"&&this.multiple?l.x`<div class="pkt-combobox__tags-outside">
+        ${this.tagPlacement==="outside"&&this.multiple?a.x`<div class="pkt-combobox__tags-outside">
               ${this.renderSingleOrMultipleValues()}
-            </div>`:l.E}
+            </div>`:a.E}
       </pkt-input-wrapper>
-    `}renderInputField(){return this.typeahead||this.allowUserInput?l.x`
+    `}renderInputField(){return this.typeahead||this.allowUserInput?a.x`
           <div class="pkt-combobox__input-div combobox__input">
             <input
               type="text"
@@ -96,7 +96,7 @@
               ${r.n(this.inputRef)}
             />
           </div>
-        `:l.x`
+        `:a.x`
           <input
             type="hidden"
             id="${this.id}-input"
@@ -104,12 +104,12 @@
             .value=${this._value.join(",")}
             ${r.n(this.inputRef)}
           />
-        `}renderSingleOrMultipleValues(){const e=!this.multiple,t=this._editingSingleValue?null:this.renderValueTag(this.findValueInOptions(this._value[0])),i=$.c(this._value,s=>s,s=>{var o;const n=this.findValueInOptions(s),u=(o=this.options.find(h=>h.value===s))==null?void 0:o.tagSkinColor;return l.x`
+        `}renderSingleOrMultipleValues(){const e=!this.multiple,t=this._editingSingleValue?null:this.renderValueTag(this.findValueInOptions(this._value[0])),i=I.c(this._value,s=>s,s=>{var h;const l=this.findValueInOptions(s),n=(h=this.options.find(u=>u.value===s))==null?void 0:h.tagSkinColor;return a.x`
           <pkt-tag
-            skin=${u||"blue-dark"}
+            skin=${n||"blue-dark"}
             ?closeTag=${!this.disabled}
             @close=${()=>this.handleTagRemove(s)}
           >
-            ${this.renderValueTag(n)}
+            ${this.renderValueTag(l)}
           </pkt-tag>
-        `});return e?t:i}renderValueTag(e){if(!e)return"";switch(this.displayValueAs){case"prefixAndValue":return l.x`<span data-focusfix=${this.id}>${e.prefix||""} ${e.value}</span>`;case"value":return l.x`<span data-focusfix=${this.id}>${e.value}</span>`;case"label":default:return l.x`<span data-focusfix=${this.id}>${e.label||e.value}</span>`}}handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.disabled)return;this.touched=!0;const t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead)if(this._search){if(this._options=this.options.filter(i=>{var s;return(s=i.fulltext)==null?void 0:s.toLowerCase().includes(this._search.toLowerCase())}),e.inputType!=="deleteContentBackward"){const i=this._options.filter(s=>{var n;return!s.selected&&((n=s.label)==null?void 0:n.toLowerCase().startsWith(this._search.toLowerCase()))});if(i.length>0&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const s=i[0];s!=null&&s.label&&(t.value=s.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection="backward")}}}else this._options=[...this.options]}handleFocus(){if(!this.disabled){if(!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const e=this.findValueInOptions(this._value[0]);this._editingSingleValue=!0,this.inputRef.value.value=this.displayValueAs==="label"&&(e!=null&&e.label)?e.label:this._value[0]}this._inputFocus=!0,this._search="",this._options=[...this.options],this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleFocusOut(e){var t,i,s,n,u;if(!this.disabled&&((i=(t=e.relatedTarget)==null?void 0:t.closest("pkt-combobox"))==null?void 0:i.id)!==this.id&&((n=(s=e.relatedTarget)==null?void 0:s.closest("pkt-combobox"))==null?void 0:n.id)!==this.id&&((u=e.target)==null?void 0:u.getAttribute("data-focusfix"))!==this.id&&e.relatedTarget!==this.focusRef.value&&e.relatedTarget!==this.inputRef.value&&e.relatedTarget!==this.arrowRef.value&&this._isOptionsOpen){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage="",this._search="",this.inputRef.value&&this.inputRef.value.type!=="hidden"&&this.inputRef.value.value!==""){const o=this.inputRef.value.value,h=this.findValueInOptions(o);!this._value.includes(o)&&!h?this.allowUserInput?this.addNewUserValue(o):this.multiple||this.removeValue(this._value[0]):h&&!this._value.includes(h.value)&&this.setSelected(h.value),this.inputRef.value.value=""}this._isOptionsOpen=!1,this.onBlur()}}handleBlur(){this._inputFocus=!1,this._editingSingleValue=!1,this.onBlur()}handleInputClick(e){var t,i;this.disabled||(e.currentTarget&&e.currentTarget!==this.arrowRef.value&&((t=this.inputRef.value)==null?void 0:t.type)!=="hidden"?(i=this.inputRef.value)==null||i.focus():this.handleArrowClick(e))}handleArrowClick(e){var t,i;this.disabled||e instanceof KeyboardEvent&&e.key&&e.key!=="Enter"&&e.key!==" "&&e.key!=="ArrowDown"||(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen?(t=this.listboxRef.value)==null||t.focusFirstOrSelectedOption():(i=this.arrowRef.value)==null||i.focus())}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase()}handleInputKeydown(e){var t,i,s;switch(e.key){case",":case"Enter":e.preventDefault(),this.addValue();break;case"Backspace":!this._search&&((t=this.inputRef.value)==null?void 0:t.type)==="hidden"&&this.removeLastValue(e);break;case"Tab":case"ArrowDown":e.shiftKey||((i=this.listboxRef.value)==null||i.focusFirstOrSelectedOption(),e.preventDefault());break;case"Escape":this._isOptionsOpen=!1,(s=this.arrowRef.value)==null||s.focus(),e.preventDefault();break}}handleTagRemove(e){this.removeSelected(e)}blurInput(){this.inputRef.value&&this.inputRef.value.matches(":focus")&&this.inputRef.value.blur()}checkForMatches(){var u;const e=((u=this.inputRef.value)==null?void 0:u.value)||this._search||"",t=e.trim().toLowerCase()||"";if(!t){!this.multiple&&this._value[0]&&this.removeValue(this._value[0]),this.resetComboboxInput(!1);return}const i=this._value.find(o=>o.toLowerCase()===t),s=this._options.filter(o=>{var h;return((h=o.label)==null?void 0:h.toLowerCase().includes(t))??!1}),n=s.find(o=>{var h;return((h=o.label)==null?void 0:h.toLowerCase())===t||o.value.toLowerCase()===t});switch(!0){case((s.length===0||!n)&&this.allowUserInput):this._addValueText=e,this._userInfoMessage="";break;case(s.length===0&&!this.allowUserInput):this._addValueText=null,this._userInfoMessage="Ingen match i søket";break;case!!i:this._addValueText=null,this._userInfoMessage="Verdien er allerede valgt";break;case s.length>1:this._addValueText=null,this._userInfoMessage="";break;default:this._addValueText=null,this._userInfoMessage=""}}findValueInOptions(e){return this.options.find(t=>t.value===e||t.label===e)||null}findIndexInOptions(e){return this._options.findIndex(t=>t.value===e||t.label===e)}isMaxItemsReached(){const e=this.maxlength!==null&&this._value.length>=this.maxlength;return e?this._maxIsReached=!0:this._maxIsReached=!1,e}toggleValue(e){var g,k;if(this.disabled)return;this.touched=!0,this._userInfoMessage="",this._addValueText=null;const t=((g=this.findValueInOptions(e))==null?void 0:g.value)||null,i=this._value.includes(e||t||""),s=!!t,n=((k=this._options.find(_=>_.value===e))==null?void 0:k.disabled)||!1,u=!(e!=null&&e.trim()),o=!this.multiple,h=this.multiple,x=this.isMaxItemsReached();let p=!1,f=!0,v="",m="";n||(!s&&this.allowUserInput&&!u?(this.addNewUserValue(e),v="Ny verdi lagt til",p=!h):!s&&!this.allowUserInput?(o&&this._value[0]&&this.removeValue(this._value[0]),f=!1,p=!0,v="Ingen treff i søket"):i?(this.removeValue(t),p=!0):u&&o?(this.removeAllSelected(),p=!0):o?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),p=!1,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value="",this.inputRef.value.blur())):h&&!x?(this.setSelected(t),p=!0):h&&x?(this._userInfoMessage="Maks antall valg nådd",f=!1,m=e):(o&&this.removeAllSelected(),this._userInfoMessage="Ingen gyldig verdi valgt",f=!1,p=!0,m=e),this._isOptionsOpen=p,p||window.setTimeout(()=>{var _;(_=this.focusRef.value)==null||_.focus()},0),this._userInfoMessage=v,this._search=m||"",this.resetComboboxInput(f),h&&this.isMaxItemsReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&this.isMaxItemsReached()){this._userInfoMessage="Maks antall valg nådd";return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,this._options=this._options.map(t=>(t.value===e&&(t.selected=!0),t)),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(i=>i!==e);const t=this.findValueInOptions(e);t?(t.selected=!1,t.userAdded?(this._options=[...this._options.filter(i=>i.value!==e)],this.options=[...this.options.filter(i=>i.value!==e)]):this._options=[...this._options,t]):!e&&!this.multiple&&(this._options=this._options.map(i=>(i.selected=!1,i)))}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage="For mange valgt";return}this._value=this._options.map(e=>e.value),this._options=this._options.map(e=>(e.selected=!0,e)),this.requestUpdate()}}removeAllSelected(){this._value=[],this._options=this._options.map(e=>(e.selected=!1,e)),this._options=this._options.filter(e=>!e.userAdded),this.requestUpdate()}addValue(){var t;const e=((t=this.inputRef.value)==null?void 0:t.value.trim())||"";this._search=e,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],this._isOptionsOpen=!1,this.blurInput();else if(!this.findValueInOptions(e)){if(this.isMaxItemsReached())return;this._value=[...this._value,e]}const t={value:e,label:e,userAdded:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.setSelected(e),this.requestUpdate()}resetComboboxInput(e=!0){if(this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&e)if(this._search="",this.multiple)this.inputRef.value.value="";else{const t=this.findValueInOptions(this._value[0]);window.setTimeout(()=>{!this.inputRef.value||this.inputRef.value.type==="hidden"||(this.inputRef.value.value=this.displayValueAs==="label"&&(t!=null&&t.label)?t.label:this._value[0]||"")},0),this._userInfoMessage=""}this._options=[...this.options]}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();const t=this._value[this._value.length-1];t&&this.removeSelected(t),this.isMaxItemsReached()}};a([l.n({type:String,reflect:!0})],exports.PktCombobox.prototype,"value",2);a([l.n({type:Array})],exports.PktCombobox.prototype,"options",2);a([l.n({type:Boolean})],exports.PktCombobox.prototype,"allowUserInput",2);a([l.n({type:Boolean})],exports.PktCombobox.prototype,"typeahead",2);a([l.n({type:Boolean})],exports.PktCombobox.prototype,"includeSearch",2);a([l.n({type:String})],exports.PktCombobox.prototype,"searchPlaceholder",2);a([l.n({type:Boolean})],exports.PktCombobox.prototype,"multiple",2);a([l.n({type:Number})],exports.PktCombobox.prototype,"maxlength",2);a([l.n({type:String})],exports.PktCombobox.prototype,"displayValueAs",2);a([l.n({type:String})],exports.PktCombobox.prototype,"tagPlacement",2);a([d.r()],exports.PktCombobox.prototype,"_options",2);a([d.r()],exports.PktCombobox.prototype,"_isOptionsOpen",2);a([d.r()],exports.PktCombobox.prototype,"_value",2);a([d.r()],exports.PktCombobox.prototype,"_userInfoMessage",2);a([d.r()],exports.PktCombobox.prototype,"_addValueText",2);a([d.r()],exports.PktCombobox.prototype,"_maxIsReached",2);a([d.r()],exports.PktCombobox.prototype,"_search",2);a([d.r()],exports.PktCombobox.prototype,"_inputFocus",2);a([d.r()],exports.PktCombobox.prototype,"_editingSingleValue",2);exports.PktCombobox=a([l.t("pkt-combobox")],exports.PktCombobox);
+        `});return e?t:i}renderValueTag(e){if(!e)return"";switch(this.displayValueAs){case"prefixAndValue":return a.x`<span data-focusfix=${this.id}>${e.prefix||""} ${e.value}</span>`;case"value":return a.x`<span data-focusfix=${this.id}>${e.value}</span>`;case"label":default:return a.x`<span data-focusfix=${this.id}>${e.label||e.value}</span>`}}handleInput(e){if(e.stopPropagation(),e.stopImmediatePropagation(),this.disabled)return;this.touched=!0;const t=e.target;if(this._search=t.value,this.checkForMatches(),this.typeahead)if(this._search){if(this._options=this.options.filter(i=>{var s;return(s=i.fulltext)==null?void 0:s.toLowerCase().includes(this._search.toLowerCase())}),e.inputType!=="deleteContentBackward"){const i=this._options.filter(s=>{var l;return!s.selected&&((l=s.label)==null?void 0:l.toLowerCase().startsWith(this._search.toLowerCase()))});if(i.length>0&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const s=i[0];s!=null&&s.label&&(t.value=s.label,window.setTimeout(()=>t.setSelectionRange(this._search.length,t.value.length),0),t.selectionDirection="backward")}}}else this._options=[...this.options]}handleFocus(){if(!this.disabled){if(!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const e=this.findValueInOptions(this._value[0]);this._editingSingleValue=!0,this.inputRef.value.value=this.displayValueAs==="label"&&(e!=null&&e.label)?e.label:this._value[0]}this._inputFocus=!0,this._search="",this._options=[...this.options],this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleFocusOut(e){var t,i,s,l,n;if(!this.disabled&&((i=(t=e.relatedTarget)==null?void 0:t.closest("pkt-combobox"))==null?void 0:i.id)!==this.id&&((l=(s=e.relatedTarget)==null?void 0:s.closest("pkt-combobox"))==null?void 0:l.id)!==this.id&&((n=e.target)==null?void 0:n.getAttribute("data-focusfix"))!==this.id&&e.relatedTarget!==this.focusRef.value&&e.relatedTarget!==this.inputRef.value&&e.relatedTarget!==this.arrowRef.value&&this._isOptionsOpen){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage="",this._search="",this.inputRef.value&&this.inputRef.value.type!=="hidden"&&this.inputRef.value.value!==""){const h=this.inputRef.value.value,u=this.findValueInOptions(h);!this._value.includes(h)&&!u?this.allowUserInput?this.addNewUserValue(h):this.multiple||this.removeValue(this._value[0]):u&&!this._value.includes(u.value)&&this.setSelected(u.value),this.inputRef.value.value=""}this._isOptionsOpen=!1,this.onBlur()}}handleBlur(){this._inputFocus=!1,this._editingSingleValue=!1,this.onBlur()}handleInputClick(e){var t,i;this.disabled||(e.currentTarget&&e.currentTarget!==this.arrowRef.value&&((t=this.inputRef.value)==null?void 0:t.type)!=="hidden"?(i=this.inputRef.value)==null||i.focus():this.handleArrowClick(e))}handleArrowClick(e){var t,i;this.disabled||e instanceof KeyboardEvent&&e.key&&e.key!=="Enter"&&e.key!==" "&&e.key!=="ArrowDown"||(e.stopImmediatePropagation(),e.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen?(t=this.listboxRef.value)==null||t.focusFirstOrSelectedOption():(i=this.arrowRef.value)==null||i.focus())}handleOptionToggled(e){this.toggleValue(e.detail)}handleSearch(e){e.stopPropagation(),this._search=e.detail.toLowerCase()}handleInputKeydown(e){var t,i,s;switch(e.key){case",":case"Enter":e.preventDefault(),this.addValue();break;case"Backspace":!this._search&&((t=this.inputRef.value)==null?void 0:t.type)==="hidden"&&this.removeLastValue(e);break;case"Tab":case"ArrowDown":e.shiftKey||((i=this.listboxRef.value)==null||i.focusFirstOrSelectedOption(),e.preventDefault());break;case"Escape":this._isOptionsOpen=!1,(s=this.arrowRef.value)==null||s.focus(),e.preventDefault();break}}handleTagRemove(e){this.removeSelected(e)}blurInput(){this.inputRef.value&&this.inputRef.value.matches(":focus")&&this.inputRef.value.blur()}checkForMatches(){var n;const e=((n=this.inputRef.value)==null?void 0:n.value)||this._search||"",t=e.trim().toLowerCase()||"";if(!t){!this.multiple&&this._value[0]&&this.removeValue(this._value[0]),this.resetComboboxInput(!1);return}const i=this._value.find(h=>h.toLowerCase()===t),s=this._options.filter(h=>{var u;return((u=h.label)==null?void 0:u.toLowerCase().includes(t))??!1}),l=s.find(h=>{var u;return((u=h.label)==null?void 0:u.toLowerCase())===t||h.value.toLowerCase()===t});switch(!0){case((s.length===0||!l)&&this.allowUserInput):this._addValueText=e,this._userInfoMessage="";break;case(s.length===0&&!this.allowUserInput):this._addValueText=null,this._userInfoMessage="Ingen match i søket";break;case!!i:this._addValueText=null,this._userInfoMessage="Verdien er allerede valgt";break;case s.length>1:this._addValueText=null,this._userInfoMessage="";break;default:this._addValueText=null,this._userInfoMessage=""}}findValueInOptions(e){return this.options.find(t=>t.value===e||t.label===e)||null}findIndexInOptions(e){return this._options.findIndex(t=>t.value===e||t.label===e)}isMaxItemsReached(){const e=this.maxlength!==null&&this._value.length>=this.maxlength;return e?this._maxIsReached=!0:this._maxIsReached=!1,e}toggleValue(e){var g,k;if(this.disabled)return;this.touched=!0,this._userInfoMessage="",this._addValueText=null;const t=((g=this.findValueInOptions(e))==null?void 0:g.value)||null,i=this._value.includes(e||t||""),s=!!t,l=((k=this._options.find(_=>_.value===e))==null?void 0:k.disabled)||!1,n=!(e!=null&&e.trim()),h=!this.multiple,u=this.multiple,x=this.isMaxItemsReached();let p=!1,f=!0,v="",m="";l||(!s&&this.allowUserInput&&!n?(this.addNewUserValue(e),v="Ny verdi lagt til",p=!u):!s&&!this.allowUserInput?(h&&this._value[0]&&this.removeValue(this._value[0]),f=!1,p=!0,v="Ingen treff i søket"):i?(this.removeValue(t),p=!0):n&&h?(this.removeAllSelected(),p=!0):h?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(t),p=!1,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value="",this.inputRef.value.blur())):u&&!x?(this.setSelected(t),p=!0):u&&x?(this._userInfoMessage="Maks antall valg nådd",f=!1,m=e):(h&&this.removeAllSelected(),this._userInfoMessage="Ingen gyldig verdi valgt",f=!1,p=!0,m=e),this._isOptionsOpen=p,p||window.setTimeout(()=>{var _;(_=this.focusRef.value)==null||_.focus()},0),this._userInfoMessage=v,this._search=m||"",this.resetComboboxInput(f),u&&this.isMaxItemsReached())}setSelected(e){if(!this._value.includes(e)){if(this.multiple&&this.isMaxItemsReached()){this._userInfoMessage="Maks antall valg nådd";return}!this.multiple&&this.removeAllSelected(),this._value=e?[...this._value,e]:this._value,this._options=this._options.map(t=>(t.value===e&&(t.selected=!0),t)),this.resetComboboxInput(!0)}}removeSelected(e){if(!e)return;this._value=this._value.filter(i=>i!==e);const t=this.findValueInOptions(e);t?(t.selected=!1,t.userAdded?(this._options=[...this._options.filter(i=>i.value!==e)],this.options=[...this.options.filter(i=>i.value!==e)]):this._options=[...this._options,t]):!e&&!this.multiple&&(this._options=this._options.map(i=>(i.selected=!1,i)))}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage="For mange valgt";return}this._value=this._options.map(e=>e.value),this._options=this._options.map(e=>(e.selected=!0,e)),this.requestUpdate()}}removeAllSelected(){this._value=[],this._options=this._options.map(e=>(e.selected=!1,e)),this._options=this._options.filter(e=>!e.userAdded),this.requestUpdate()}addValue(){var t;const e=((t=this.inputRef.value)==null?void 0:t.value.trim())||"";this._search=e,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],this._isOptionsOpen=!1,this.blurInput();else if(!this.findValueInOptions(e)){if(this.isMaxItemsReached())return;this._value=[...this._value,e]}const t={value:e,label:e,userAdded:!0};this.options=[t,...this.options],this._options=[t,...this._options],this.setSelected(e),this.requestUpdate()}resetComboboxInput(e=!0){if(this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&e)if(this._search="",this.multiple)this.inputRef.value.value="";else{const t=this.findValueInOptions(this._value[0]);window.setTimeout(()=>{!this.inputRef.value||this.inputRef.value.type==="hidden"||(this.inputRef.value.value=this.displayValueAs==="label"&&(t!=null&&t.label)?t.label:this._value[0]||"")},0),this._userInfoMessage=""}this._options=[...this.options]}removeLastValue(e){if(this._value.length===0)return;e.preventDefault();const t=this._value[this._value.length-1];t&&this.removeSelected(t),this.isMaxItemsReached()}};o([a.n({type:String,reflect:!0})],exports.PktCombobox.prototype,"value",2);o([a.n({type:Array})],exports.PktCombobox.prototype,"options",2);o([a.n({type:Array})],exports.PktCombobox.prototype,"defaultOptions",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"allowUserInput",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"typeahead",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"includeSearch",2);o([a.n({type:String})],exports.PktCombobox.prototype,"searchPlaceholder",2);o([a.n({type:Boolean})],exports.PktCombobox.prototype,"multiple",2);o([a.n({type:Number})],exports.PktCombobox.prototype,"maxlength",2);o([a.n({type:String})],exports.PktCombobox.prototype,"displayValueAs",2);o([a.n({type:String})],exports.PktCombobox.prototype,"tagPlacement",2);o([d.r()],exports.PktCombobox.prototype,"_options",2);o([d.r()],exports.PktCombobox.prototype,"_isOptionsOpen",2);o([d.r()],exports.PktCombobox.prototype,"_value",2);o([d.r()],exports.PktCombobox.prototype,"_userInfoMessage",2);o([d.r()],exports.PktCombobox.prototype,"_addValueText",2);o([d.r()],exports.PktCombobox.prototype,"_maxIsReached",2);o([d.r()],exports.PktCombobox.prototype,"_search",2);o([d.r()],exports.PktCombobox.prototype,"_inputFocus",2);o([d.r()],exports.PktCombobox.prototype,"_editingSingleValue",2);exports.PktCombobox=o([a.t("pkt-combobox")],exports.PktCombobox);

package/dist/{consent-CkDh30xr.cjs → consent-D1r9LYda.cjs}

@@ -1,4 +1,4 @@
-"use strict";const s=require("./element-90YeMNbV.cjs");require("./button-oZThyRNI.cjs");require("./icon-B1_BRNqf.cjs");const g={i18n:{nb:{contentPresentation:{title:"Oslo kommune bruker informasjonskapsler",description:["For at nettstedet skal fungere og være trygt, bruker Oslo kommune informasjonskapsler. Noen er teknisk nødvendige, mens andre sikrer ulik funksjonalitet.","Godtar du alle informasjonskapsler, tillater du også at vi samler inn data om statistikk og brukeradferd. Da hjelper du oss med å lage et bedre nettsted uten at du trenger å dele noe personlig informasjon med oss."],buttons:{accept:"Godta alle",reject:"Kun nødvendige",settings:"Innstillinger for informasjonskapsler"}},contentSettings:{title:"Innstillinger for informasjonskapsler",description:["Her kan du velge hvilke typer informasjonskapsler du vil tillate. Tillatelsen gjelder i 90 dager. Husk at nødvendige informasjonskapsler ikke kan velges bort.","Du kan når som helst endre innstillingene og finne mer informasjon nederst på nettstedet under «Innstillinger for informasjonskapsler» og «Personvern og informasjonskapsler»."],buttons:{back:"Tilbake",save:"Lagre innstillinger"}}},en:{contentPresentation:{title:"Before you visit Oslo kommune ...",description:["This website uses cookies to make improvements. In this context, we need your consent to measure the traffic on the website in relation to statistics and feedback.","To read more about what we use cookies for, go to our privacy declaration which you will find at the bottom of our websites."],buttons:{accept:"Yes, I accept",reject:"Only necessary",settings:"Go to settings"}},contentSettings:{title:"Her kan du aktivt velge mellom ulike informasjonskapsler",description:["For å lese mer om hva vi bruker informasjonskapsler til gå til vår personvernserklering som du finner på våre nettsider"],buttons:{back:"Back",save:"Save settings"}}}}},c=globalThis,d=c.__cookieEvents||{events:{},on(n,e){this.events[n]||(this.events[n]=[]),this.events[n].push(e)},off(n,e){this.events[n]&&(this.events[n]=this.events[n].filter(t=>t!==e))},once(n,e){const t=o=>{this.off(n,t),e(o)};this.on(n,t)},emit(n,e){this.events[n]&&this.events[n].forEach(t=>t(e))}};c.__cookieEvents=d;const k=d;var u=Object.defineProperty,p=Object.getOwnPropertyDescriptor,a=(n,e,t,o)=>{for(var i=o>1?void 0:o?p(e,t):e,r=n.length-1,l;r>=0;r--)(l=n[r])&&(i=(o?l(e,t,i):l(i))||i);return o&&i&&u(e,t,i),i};exports.PktConsent=class extends s.PktElement{constructor(){super(),this.hotjarId=null,this.googleAnalyticsId=null,this.triggerType="button",this.triggerText=null,this.i18nLanguage="nb"}connectedCallback(){super.connectedCallback(),this.triggerText=this.triggerText||g.i18n[this.i18nLanguage].contentPresentation.buttons.settings,this.googleAnalyticsId&&(window.googleAnalyticsId=this.googleAnalyticsId),this.hotjarId&&(window.hotjarId=this.hotjarId),k.on("CookieManager.setCookie",e=>{this.emitCookieConsents(e)})}returnJsonOrObject(e){let t;try{t=JSON.parse(e)}catch{t=e}return t}emitCookieConsents(e){const o=this.returnJsonOrObject(e.value).items.reduce((i,r)=>(i[r.name]=r.consent,i),{});this.dispatchEvent(new CustomEvent("toggle-consent",{detail:o,bubbles:!0,composed:!0}))}firstUpdated(e){if(!document.querySelector("#oslo-consent-script")&&window.location.hostname.toLowerCase().includes("oslo.kommune.no")){window.googleAnalyticsId=this.googleAnalyticsId,window.hotjarId=this.hotjarId;const t=document.createElement("script");t.src="https://cdn.web.oslo.kommune.no/cb/cb-v1.0.0.js",t.id="oslo-consent-script",t.onload=()=>{this.triggerInit()},document.head.appendChild(t);const o=document.createElement("link");o.href="https://cdn.web.oslo.kommune.no/cb/cb-v1.0.0.css",o.type="text/css",o.rel="stylesheet",o.id="oslo-consent-styles",document.head.appendChild(o)}}triggerInit(){window.document.dispatchEvent(new Event("DOMContentLoaded",{bubbles:!0,cancelable:!0})),window.cookieBanner.cookieConsent.validateConsentCookie().then(e=>{if(e){const o={value:window.cookieBanner.cookieConsent.getConsentCookie()};this.emitCookieConsents(o)}})}openModal(e){e.preventDefault(),window.cookieBanner.cookieConsent||this.triggerInit(),setTimeout(()=>window.cookieBanner.openCookieModal())}render(){return this.triggerType==="link"?s.x`<a href="#" class="pkt-link" @click=${this.openModal}>${this.triggerText}</a>`:this.triggerType==="footerlink"?s.x`<a href="#" class="pkt-footer__link" @click=${this.openModal}>
+"use strict";const s=require("./element-90YeMNbV.cjs");require("./button-KzBZ-Bff.cjs");require("./icon-B1_BRNqf.cjs");const g={i18n:{nb:{contentPresentation:{title:"Oslo kommune bruker informasjonskapsler",description:["For at nettstedet skal fungere og være trygt, bruker Oslo kommune informasjonskapsler. Noen er teknisk nødvendige, mens andre sikrer ulik funksjonalitet.","Godtar du alle informasjonskapsler, tillater du også at vi samler inn data om statistikk og brukeradferd. Da hjelper du oss med å lage et bedre nettsted uten at du trenger å dele noe personlig informasjon med oss."],buttons:{accept:"Godta alle",reject:"Kun nødvendige",settings:"Innstillinger for informasjonskapsler"}},contentSettings:{title:"Innstillinger for informasjonskapsler",description:["Her kan du velge hvilke typer informasjonskapsler du vil tillate. Tillatelsen gjelder i 90 dager. Husk at nødvendige informasjonskapsler ikke kan velges bort.","Du kan når som helst endre innstillingene og finne mer informasjon nederst på nettstedet under «Innstillinger for informasjonskapsler» og «Personvern og informasjonskapsler»."],buttons:{back:"Tilbake",save:"Lagre innstillinger"}}},en:{contentPresentation:{title:"Before you visit Oslo kommune ...",description:["This website uses cookies to make improvements. In this context, we need your consent to measure the traffic on the website in relation to statistics and feedback.","To read more about what we use cookies for, go to our privacy declaration which you will find at the bottom of our websites."],buttons:{accept:"Yes, I accept",reject:"Only necessary",settings:"Go to settings"}},contentSettings:{title:"Her kan du aktivt velge mellom ulike informasjonskapsler",description:["For å lese mer om hva vi bruker informasjonskapsler til gå til vår personvernserklering som du finner på våre nettsider"],buttons:{back:"Back",save:"Save settings"}}}}},c=globalThis,d=c.__cookieEvents||{events:{},on(n,e){this.events[n]||(this.events[n]=[]),this.events[n].push(e)},off(n,e){this.events[n]&&(this.events[n]=this.events[n].filter(t=>t!==e))},once(n,e){const t=o=>{this.off(n,t),e(o)};this.on(n,t)},emit(n,e){this.events[n]&&this.events[n].forEach(t=>t(e))}};c.__cookieEvents=d;const k=d;var u=Object.defineProperty,p=Object.getOwnPropertyDescriptor,a=(n,e,t,o)=>{for(var i=o>1?void 0:o?p(e,t):e,r=n.length-1,l;r>=0;r--)(l=n[r])&&(i=(o?l(e,t,i):l(i))||i);return o&&i&&u(e,t,i),i};exports.PktConsent=class extends s.PktElement{constructor(){super(),this.hotjarId=null,this.googleAnalyticsId=null,this.triggerType="button",this.triggerText=null,this.i18nLanguage="nb"}connectedCallback(){super.connectedCallback(),this.triggerText=this.triggerText||g.i18n[this.i18nLanguage].contentPresentation.buttons.settings,this.googleAnalyticsId&&(window.googleAnalyticsId=this.googleAnalyticsId),this.hotjarId&&(window.hotjarId=this.hotjarId),k.on("CookieManager.setCookie",e=>{this.emitCookieConsents(e)})}returnJsonOrObject(e){let t;try{t=JSON.parse(e)}catch{t=e}return t}emitCookieConsents(e){const o=this.returnJsonOrObject(e.value).items.reduce((i,r)=>(i[r.name]=r.consent,i),{});this.dispatchEvent(new CustomEvent("toggle-consent",{detail:o,bubbles:!0,composed:!0}))}firstUpdated(e){if(!document.querySelector("#oslo-consent-script")&&window.location.hostname.toLowerCase().includes("oslo.kommune.no")){window.googleAnalyticsId=this.googleAnalyticsId,window.hotjarId=this.hotjarId;const t=document.createElement("script");t.src="https://cdn.web.oslo.kommune.no/cb/cb-v1.0.0.js",t.id="oslo-consent-script",t.onload=()=>{this.triggerInit()},document.head.appendChild(t);const o=document.createElement("link");o.href="https://cdn.web.oslo.kommune.no/cb/cb-v1.0.0.css",o.type="text/css",o.rel="stylesheet",o.id="oslo-consent-styles",document.head.appendChild(o)}}triggerInit(){window.document.dispatchEvent(new Event("DOMContentLoaded",{bubbles:!0,cancelable:!0})),window.cookieBanner.cookieConsent.validateConsentCookie().then(e=>{if(e){const o={value:window.cookieBanner.cookieConsent.getConsentCookie()};this.emitCookieConsents(o)}})}openModal(e){e.preventDefault(),window.cookieBanner.cookieConsent||this.triggerInit(),setTimeout(()=>window.cookieBanner.openCookieModal())}render(){return this.triggerType==="link"?s.x`<a href="#" class="pkt-link" @click=${this.openModal}>${this.triggerText}</a>`:this.triggerType==="footerlink"?s.x`<a href="#" class="pkt-footer__link" @click=${this.openModal}>
         <pkt-icon name="chevron-right" class="pkt-footer__link-icon"></pkt-icon>
         ${this.triggerText}
       </a>`:this.triggerType==="icon"?s.x`<pkt-button

package/dist/{consent-B_cBTKCZ.js → consent-a09DlJZT.js}

@@ -1,5 +1,5 @@
 import { P as k, x as l, n as a, a as u } from "./element-gAd63VwC.js";
-import "./button-BSTI5da6.js";
+import "./button-OLSvT2Im.js";
 import "./icon-CO1TLSs5.js";
 const h = {
   i18n: {

package/dist/index.d.ts

@@ -163,6 +163,7 @@ export declare interface IPktCombobox {
     optionalTag?: boolean;
     optionalText?: string;
     options?: IPktComboboxOption[];
+    defaultOptions?: IPktComboboxOption[];
     placeholder?: string | null;
     requiredTag?: boolean;
     requiredText?: string;
@@ -355,8 +356,6 @@ export declare class PktBackLink extends PktElement<IPktBackLink> implements IPk
 }
 
 export declare class PktButton extends PktElement<IPktButton> implements IPktButton {
-    static formAssociated: boolean;
-    private internals;
     slotController: PktSlotController;
     defaultSlot: Ref<HTMLElement>;
     constructor();
@@ -369,18 +368,13 @@ export declare class PktButton extends PktElement<IPktButton> implements IPktBut
     variant: TPktButtonVariant;
     state?: TPktButtonState;
     type: TPktButtonType;
+    form: string | undefined;
     isLoading: Booleanish;
     disabled: Booleanish;
     loadingAnimationPath: string | undefined;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
     attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
     protected firstUpdated(_changedProperties: PropertyValues): void;
-    protected updated(_changedProperties: PropertyValues): void;
     render(): TemplateResult<1>;
-    private updateElementClasses;
-    private handleClick;
-    private handleKeydown;
 }
 
 export declare class PktCalendar extends PktElement {
@@ -519,6 +513,7 @@ export declare class PktCombobox extends PktInputElement implements IPktCombobox
     constructor();
     value: string | string[];
     options: IPktComboboxOption[];
+    defaultOptions: IPktComboboxOption[];
     allowUserInput: boolean;
     typeahead: boolean;
     includeSearch: boolean;

package/dist/pkt-button.cjs

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

package/dist/pkt-button.js

@@ -1,4 +1,4 @@
-import { P as t } from "./button-BSTI5da6.js";
+import { P as t } from "./button-OLSvT2Im.js";
 const a = t;
 export {
   t as PktButton,

package/dist/pkt-combobox.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./combobox-lds6Lryq.cjs"),o=e.PktCombobox;Object.defineProperty(exports,"PktCombobox",{enumerable:!0,get:()=>e.PktCombobox});exports.default=o;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./combobox-DMkMUJfx.cjs"),o=e.PktCombobox;Object.defineProperty(exports,"PktCombobox",{enumerable:!0,get:()=>e.PktCombobox});exports.default=o;

package/dist/pkt-combobox.js

@@ -1,4 +1,4 @@
-import { P as o } from "./combobox-Ct7-a2Vy.js";
+import { P as o } from "./combobox-CavDENt-.js";
 const b = o;
 export {
   o as PktCombobox,

package/dist/pkt-consent.cjs

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

package/dist/pkt-consent.js

@@ -1,4 +1,4 @@
-import { P as t } from "./consent-B_cBTKCZ.js";
+import { P as t } from "./consent-a09DlJZT.js";
 const o = t;
 export {
   t as PktConsent,

package/dist/pkt-index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("./alert-D2PhTV94.cjs"),l=require("./accordionitem-Dz6jwPpb.cjs"),d=require("./backlink-CcAZfB1d.cjs"),b=require("./button-oZThyRNI.cjs"),k=require("./calendar-BDeaGBaH.cjs"),m=require("./card-CmdIb2X9.cjs"),g=require("./combobox-lds6Lryq.cjs"),h=require("./consent-CkDh30xr.cjs"),f=require("./checkbox-CiXWukkL.cjs"),t=require("./element-90YeMNbV.cjs"),y=require("./pkt-slot-controller-Da-RgXfS.cjs"),s=require("./ref-B-w1vCo8.cjs"),O=require("./class-map-DWDPOqjO.cjs"),j=require("./datepicker-DpQV8G6g.cjs"),q=require("./helptext-AqNI_oFG.cjs"),x=require("./heading-CxJ0IqpU.cjs"),C=require("./icon-B1_BRNqf.cjs"),v=require("./input-wrapper-B_TtkGqo.cjs"),S=require("./link-BWJrqWi7.cjs"),$=require("./linkcard-0KLDuaGM.cjs"),L=require("./loader--5h6NKGl.cjs"),_=require("./messagebox-IJOkv427.cjs"),A=require("./modal-CBURcXBd.cjs"),B=require("./progressbar-BrXtjUvh.cjs"),p=require("./radiobutton-x10h-JEh.cjs"),T=require("./tag-lU4vz70a.cjs"),I=require("./textarea-j8kBS-hf.cjs"),M=require("./textinput-kmcj-FlC.cjs"),R=require("./select-BUvu5SFp.cjs");var H=Object.defineProperty,w=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?w(e,r):e,u=a.length-1,c;u>=0;u--)(c=a[u])&&(n=(i?c(e,r,n):c(n))||n);return i&&n&&H(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new y.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 P=require("./alert-D2PhTV94.cjs"),l=require("./accordionitem-Dz6jwPpb.cjs"),d=require("./backlink-CcAZfB1d.cjs"),b=require("./button-KzBZ-Bff.cjs"),k=require("./calendar-BDeaGBaH.cjs"),m=require("./card-CmdIb2X9.cjs"),g=require("./combobox-DMkMUJfx.cjs"),h=require("./consent-D1r9LYda.cjs"),f=require("./checkbox-CiXWukkL.cjs"),t=require("./element-90YeMNbV.cjs"),y=require("./pkt-slot-controller-Da-RgXfS.cjs"),s=require("./ref-B-w1vCo8.cjs"),O=require("./class-map-DWDPOqjO.cjs"),j=require("./datepicker-DpQV8G6g.cjs"),q=require("./helptext-AqNI_oFG.cjs"),x=require("./heading-CxJ0IqpU.cjs"),C=require("./icon-B1_BRNqf.cjs"),v=require("./input-wrapper-B_TtkGqo.cjs"),S=require("./link-BWJrqWi7.cjs"),$=require("./linkcard-0KLDuaGM.cjs"),L=require("./loader--5h6NKGl.cjs"),_=require("./messagebox-IJOkv427.cjs"),A=require("./modal-CBURcXBd.cjs"),B=require("./progressbar-BrXtjUvh.cjs"),p=require("./radiobutton-x10h-JEh.cjs"),T=require("./tag-lU4vz70a.cjs"),I=require("./textarea-j8kBS-hf.cjs"),M=require("./textinput-kmcj-FlC.cjs"),R=require("./select-BUvu5SFp.cjs");var H=Object.defineProperty,w=Object.getOwnPropertyDescriptor,o=(a,e,r,i)=>{for(var n=i>1?void 0:i?w(e,r):e,u=a.length-1,c;u>=0;u--)(c=a[u])&&(n=(i?c(e,r,n):c(n))||n);return i&&n&&H(e,r,n),n};exports.PktComponent=class extends t.PktElement{constructor(){super(),this.string="",this.strings=[],this.darkmode=!1,this._list=[],this.defaultSlot=s.e(),this.namedSlot=s.e(),this.slotController=new y.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="${O.e(e)}">
         <h1 class="pkt-txt-28">${this.string}</h1>
 

package/dist/pkt-index.js

@@ -1,12 +1,12 @@
 import { P as A } from "./alert-CoGYPbs-.js";
 import { P as B, a as E } from "./accordionitem-DkE9or0K.js";
 import { P as O } from "./backlink-BnlrDl9O.js";
-import { P as T } from "./button-BSTI5da6.js";
+import { P as T } from "./button-OLSvT2Im.js";
 import { c as f } from "./calendar-Beno8yU7.js";
 import { P as D } from "./calendar-Beno8yU7.js";
 import { P as G } from "./card-BxHlJq4J.js";
-import { P as K } from "./combobox-Ct7-a2Vy.js";
-import { P as U } from "./consent-B_cBTKCZ.js";
+import { P as K } from "./combobox-CavDENt-.js";
+import { P as U } from "./consent-a09DlJZT.js";
 import { P as q } from "./checkbox-B67_cfqW.js";
 import { P as k, t as h, x as P, n, a as c } from "./element-gAd63VwC.js";
 import { P as x } from "./pkt-slot-controller-DtDaD9q_.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-elements",
-  "version": "12.40.10",
+  "version": "12.41.1",
   "description": "Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -32,7 +32,7 @@
   },
   "devDependencies": {
     "@oslokommune/punkt-assets": "^12.39.2",
-    "@oslokommune/punkt-css": "^12.40.10",
+    "@oslokommune/punkt-css": "^12.41.0",
     "sass": "^1.78.0",
     "typescript": "^5.6.2",
     "vite": "^5.4.18",
@@ -59,5 +59,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "cc642acc20fb7c667d25909bd6309fe613f66c6f"
+  "gitHead": "6af0ba1d43d2ba724a15b4d37c80ab62a68c8cae"
 }

package/src/components/button/button.ts

@@ -3,6 +3,8 @@ import { PktSlotController } from '@/controllers/pkt-slot-controller'
 import { PktIconName } from '@oslokommune/punkt-assets/dist/icons/icon'
 import { html, nothing, PropertyValues } from 'lit'
 import { property, customElement } from 'lit/decorators.js'
+import { classMap } from 'lit/directives/class-map.js'
+import { ifDefined } from 'lit/directives/if-defined.js'
 import { createRef, Ref, ref } from 'lit/directives/ref.js'
 
 // Allow global override of animation assets path
@@ -51,8 +53,6 @@ export interface IPktButton {
 }
 @customElement('pkt-button')
 export class PktButton extends PktElement<IPktButton> implements IPktButton {
-  static formAssociated = true
-  private internals = this.attachInternals()
   slotController: PktSlotController
   defaultSlot: Ref<HTMLElement> = createRef()
 
@@ -70,25 +70,14 @@ export class PktButton extends PktElement<IPktButton> implements IPktButton {
   @property({ type: String }) skin: TPktButtonSkin = 'primary'
   @property({ type: String }) variant: TPktButtonVariant = 'label-only'
   @property({ type: String, reflect: true }) state?: TPktButtonState = 'normal'
-  @property({ type: String, reflect: true }) type: TPktButtonType = 'button'
+  @property({ type: String }) type: TPktButtonType = 'button'
+  @property({ type: String }) form: string | undefined = undefined
   @property({ type: Boolean, reflect: true }) isLoading: Booleanish = false
   @property({ type: Boolean, reflect: true }) disabled: Booleanish = false
   @property({ type: String }) loadingAnimationPath: string | undefined = window.pktAnimationPath
 
   // Lifecycle
 
-  connectedCallback() {
-    super.connectedCallback();
-    this.addEventListener('click', this.handleClick as EventListener)
-    this.addEventListener('keydown', this.handleKeydown as EventListener)
-  }
-
-  disconnectedCallback() {
-    super.disconnectedCallback()
-    this.removeEventListener('click', this.handleClick as EventListener)
-    this.removeEventListener('keydown', this.handleKeydown as EventListener)
-  }
-
   attributeChangedCallback(name: string, _old: string | null, value: string | null): void {
     super.attributeChangedCallback(name, _old, value)
     // Convert strings to booleans
@@ -111,57 +100,36 @@ export class PktButton extends PktElement<IPktButton> implements IPktButton {
     }
   }
 
-  protected updated(_changedProperties: PropertyValues): void {
-    super.updated(_changedProperties)
-
-    this.setAttribute('role', 'button')
-    this.internals.role = 'button'
-
-    if (this.disabled === 'false') {
-      this.disabled = false
-    }
-    if (this.isLoading === 'false') {
-      this.isLoading = false
-    }
-
-    if (this.disabled) {
-      if (this.getAttribute('tabindex') !== '-1') {
-        this.setAttribute('tabindex', '-1')
-      }
-      if (this.getAttribute('aria-disabled') !== 'true') {
-        this.setAttribute('aria-disabled', 'true')
-      }
-    } else {
-      if (this.getAttribute('tabindex') !== '0') {
-        this.setAttribute('tabindex', '0')
-      }
-      if (this.getAttribute('aria-disabled') !== 'false') {
-        this.removeAttribute('aria-disabled')
-      }
-    }
-    if (this.isLoading) {
-      if (this.getAttribute('aria-busy') !== 'true') {
-        this.setAttribute('aria-busy', 'true')
-      }
-    } else {
-      if (this.hasAttribute('aria-busy')) {
-        this.removeAttribute('aria-busy')
-      }
-    }
-
-    this.updateElementClasses()
-  }
-
   // Render
 
   render() {
+    const formId = this.form ?? this.getAttribute('form') ?? undefined
+
+    const classes = {
+      'pkt-btn': true,
+      [`pkt-btn--${this.size}`]: !!this.size,
+      [`pkt-btn--${this.skin}`]: !!this.skin,
+      [`pkt-btn--${this.variant}`]: !!this.variant,
+      [`pkt-btn--${this.color}`]: !!this.color,
+      [`pkt-btn--${this.state}`]: !!this.state,
+      'pkt-btn--disabled': !!this.disabled,
+      'pkt-btn--isLoading': !!this.isLoading,
+    }
+
     return html`
-      <div class="pkt-contents">
+      <button
+        class=${classMap(classes)}
+        type=${this.type}
+        ?disabled=${!!this.disabled}
+        aria-busy=${ifDefined(this.isLoading ? 'true' : undefined)}
+        aria-disabled=${ifDefined(this.disabled ? 'true' : undefined)}
+        form=${ifDefined(formId)}
+      >
         ${this.isLoading
           ? html`<pkt-icon
               class="pkt-btn__icon pkt-btn__spinner"
               name="spinner-blue"
-              path=${this.loadingAnimationPath}
+              path=${ifDefined(this.loadingAnimationPath)}
             ></pkt-icon>`
           : nothing}
         ${this.variant !== 'label-only'
@@ -171,73 +139,9 @@ export class PktButton extends PktElement<IPktButton> implements IPktButton {
         ${this.variant === 'icons-right-and-left'
           ? html`<pkt-icon class="pkt-btn__icon" name=${this.secondIconName}></pkt-icon>`
           : nothing}
-      </div>
+      </button>
     `
   }
-
-  // Methods
-
-  private updateElementClasses() {
-    const classes = new Set<string>()
-    const currentClasses = this.getAttribute('class')
-
-    classes.add('pkt-btn')
-
-    if (currentClasses) {
-      currentClasses.split(' ').forEach((classname) => classes.add(classname))
-    }
-    if (this.size) classes.add(`pkt-btn--${this.size}`)
-    if (this.skin) classes.add(`pkt-btn--${this.skin}`)
-    if (this.variant) classes.add(`pkt-btn--${this.variant}`)
-    if (this.color) classes.add(`pkt-btn--${this.color}`)
-    if (this.isLoading) classes.add('pkt-btn--active')
-    if (this.state) classes.add(`pkt-btn--${this.state}`)
-    if (this.disabled) classes.add('pkt-btn--disabled')
-
-    this.className = [...classes].join(' ')
-  }
-
-  private handleClick(event: MouseEvent) {
-    if (this.disabled || this.isLoading) {
-      event.preventDefault()
-      event.stopImmediatePropagation()
-      return
-    }
-
-    if (this.type === 'submit' && this.internals.form) {
-      this.internals.form.requestSubmit()
-
-      return
-    }
-    if (this.type === 'reset' && this.internals.form) {
-      this.internals.form.reset()
-
-      return
-    }
-
-    if (this.onClick && typeof this.onClick === 'function' && this.onClick !== this.handleClick) {
-      this.onClick(event)
-    }
-
-    this.dispatchEvent(
-      new CustomEvent('button-click', {
-        bubbles: true,
-        composed: true,
-        detail: { originalEvent: event },
-      }),
-    )
-  }
-
-  private handleKeydown(event: KeyboardEvent) {
-    if (this.disabled || this.isLoading) return
-
-    if (event.key === 'Enter' || event.key === ' ') {
-      event.preventDefault()
-      const button = event.target as HTMLButtonElement
-      if (button) {
-        button.click()
-      }
-    }
-  }
 }
+
 export default PktButton

package/src/components/combobox/combobox.ts

@@ -49,6 +49,7 @@ export interface IPktCombobox {
   optionalTag?: boolean
   optionalText?: string
   options?: IPktComboboxOption[]
+  defaultOptions?: IPktComboboxOption[]
   placeholder?: string | null
   requiredTag?: boolean
   requiredText?: string
@@ -79,6 +80,7 @@ export class PktCombobox extends PktInputElement implements IPktCombobox {
   // Props / Attributes
   @property({ type: String, reflect: true }) value: string | string[] = ''
   @property({ type: Array }) options: IPktComboboxOption[] = []
+  @property({ type: Array }) defaultOptions: IPktComboboxOption[] = []
   @property({ type: Boolean }) allowUserInput: boolean = false
   @property({ type: Boolean }) typeahead: boolean = false
   @property({ type: Boolean }) includeSearch: boolean = false
@@ -118,6 +120,15 @@ export class PktCombobox extends PktInputElement implements IPktCombobox {
       })
 
     this._options = []
+
+    // Deep clone defaultOptions into options, preserving userAdded options
+    if (this.defaultOptions && this.defaultOptions.length) {
+      const userAdded = this.options?.filter((opt) => opt.userAdded) || []
+      this.options = [...userAdded, ...structuredClone(this.defaultOptions)]
+      this._options = [...this.options]
+    }
+
+    // If options are provided via the options slot, we need to extract them
     if (this.optionsController.nodes.length) {
       const options: IPktComboboxOption[] = []
       this.optionsController.nodes.forEach((node: Element) => {
@@ -156,8 +167,23 @@ export class PktCombobox extends PktInputElement implements IPktCombobox {
       }
       this.isMaxItemsReached()
     }
+
+    // If defaultOptions changed, update options (preserving userAdded)
+    if (changedProperties.has('defaultOptions') && this.defaultOptions.length) {
+      const userAdded = this.options?.filter((opt) => opt.userAdded) || []
+      this.options = [...userAdded, ...structuredClone(this.defaultOptions)]
+      this._options = [...this.options]
+    }
+
     if (changedProperties.has('options') && this.options.length) {
-      this._options = this.options
+      // If options change, we need to update _options, but we need to preserve userAdded values
+      const userAddedValues = this._options.filter((option) => option.userAdded)
+      // Filter out userAddedValues that are overridden by this.options
+      const filteredUserAdded = userAddedValues.filter(
+        (userOpt) => !this.options.some((opt) => opt.value === userOpt.value),
+      )
+      // Merge, giving precedence to this.options
+      this._options = [...filteredUserAdded, ...this.options]
       this._options.forEach((option) => {
         if (option.value && !option.label) {
           option.label = option.value