@oslokommune/punkt-elements 13.2.3 → 13.3.0

package/dist/{card-Djnd-pgo.js → card-BI1NZONj.js}

@@ -4,7 +4,7 @@ import { P as m, E as d, x as t, n as i, a as u } from "./element-CgEWt74-.js";
 import { P as $ } from "./pkt-slot-controller-BPGj-LC5.js";
 import { e as y, n as _ } from "./ref-BBYSqgeW.js";
 import "./icon-CC1js8eR.js";
-import "./tag-BWm6s48d.js";
+import "./tag-DyXzTY68.js";
 const b = {
   layout: {
     default: "vertical"
@@ -18,10 +18,10 @@ const b = {
 }, k = {
   props: b
 };
-var f = Object.defineProperty, S = Object.getOwnPropertyDescriptor, a = (r, s, p, o) => {
-  for (var n = o > 1 ? void 0 : o ? S(s, p) : s, l = r.length - 1, h; l >= 0; l--)
-    (h = r[l]) && (n = (o ? h(s, p, n) : h(n)) || n);
-  return o && n && f(s, p, n), n;
+var f = Object.defineProperty, S = Object.getOwnPropertyDescriptor, a = (r, s, o, p) => {
+  for (var n = p > 1 ? void 0 : p ? S(s, o) : s, l = r.length - 1, h; l >= 0; l--)
+    (h = r[l]) && (n = (p ? h(s, o, n) : h(n)) || n);
+  return p && n && f(s, o, n), n;
 };
 let e = class extends m {
   //Constructor
@@ -38,18 +38,18 @@ let e = class extends m {
   // Main render method
   // prettier-ignore
   render() {
-    var o, n;
+    var p, n;
     const r = {
       "pkt-card": !0,
       [`pkt-card--${this.skin}`]: this.skin,
       [`pkt-card--${this.layout}`]: this.layout,
       [`pkt-card--padding-${this.padding}`]: this.padding,
       "pkt-card--border-on-hover": this.borderOnHover
-    }, s = ((o = this.ariaLabel) == null ? void 0 : o.trim()) || (this.heading ? `${this.heading} lenkekort` : "lenkekort"), p = ((n = this.ariaLabel) == null ? void 0 : n.trim()) || (this.heading ? this.heading : "kort");
+    }, s = ((p = this.ariaLabel) == null ? void 0 : p.trim()) || (this.heading ? `${this.heading} lenkekort` : "lenkekort"), o = ((n = this.ariaLabel) == null ? void 0 : n.trim()) || (this.heading ? this.heading : "kort");
     return t`
       <article
         class=${g(r)}
-        aria-label=${c(this.clickCardLink ? s : p)}
+        aria-label=${c(this.clickCardLink ? s : o)}
       >
         ${this.renderImage()}
         <div class="pkt-card__wrapper">
@@ -151,7 +151,7 @@ let e = class extends m {
                     skin=${c(s.skin)}
                     iconName=${c(s.iconName)}
                   >
-                    ${s.text}
+                    <span>${s.text}</span>
                   </pkt-tag>
                 `
     )}

package/dist/{card-Bx36j0q4.cjs → card-uccD6Pnv.cjs}

@@ -1,4 +1,4 @@
-"use strict";const l=require("./class-map-BBG2gMX4.cjs"),p=require("./if-defined-Cni-RHLS.cjs"),t=require("./element-6DBpyGQm.cjs"),g=require("./pkt-slot-controller-BzddBp7z.cjs"),c=require("./ref-iJtiv3o2.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-DPk3fpEg.cjs");const k={layout:{default:"vertical"},skin:{default:"outlined"},padding:{default:"default"}},h={props:k};var u=Object.defineProperty,m=Object.getOwnPropertyDescriptor,e=(d,a,i,s)=>{for(var r=s>1?void 0:s?m(a,i):a,n=d.length-1,o;n>=0;n--)(o=d[n])&&(r=(s?o(a,i,r):o(r))||r);return s&&r&&u(a,i,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.ariaLabel="",this.metaLead=null,this.borderOnHover=!0,this.clickCardLink=null,this.metaTrail=null,this.layout=h.props.layout.default,this.heading="",this.headinglevel=3,this.image={src:"",alt:""},this.imageShape="square",this.openLinkInNewTab=!1,this.padding=h.props.padding.default,this.skin=h.props.skin.default,this.subheading="",this.tagPosition="top",this.tags=[],this.slotController=new g.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){var r,n;const a={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.layout}`]:this.layout,[`pkt-card--padding-${this.padding}`]:this.padding,"pkt-card--border-on-hover":this.borderOnHover},i=((r=this.ariaLabel)==null?void 0:r.trim())||(this.heading?`${this.heading} lenkekort`:"lenkekort"),s=((n=this.ariaLabel)==null?void 0:n.trim())||(this.heading?this.heading:"kort");return t.x`
+"use strict";const l=require("./class-map-BBG2gMX4.cjs"),p=require("./if-defined-Cni-RHLS.cjs"),t=require("./element-6DBpyGQm.cjs"),g=require("./pkt-slot-controller-BzddBp7z.cjs"),c=require("./ref-iJtiv3o2.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-Bbs0U_Au.cjs");const k={layout:{default:"vertical"},skin:{default:"outlined"},padding:{default:"default"}},h={props:k};var u=Object.defineProperty,m=Object.getOwnPropertyDescriptor,e=(d,a,i,s)=>{for(var r=s>1?void 0:s?m(a,i):a,n=d.length-1,o;n>=0;n--)(o=d[n])&&(r=(s?o(a,i,r):o(r))||r);return s&&r&&u(a,i,r),r};exports.PktCard=class extends t.PktElement{constructor(){super(),this.defaultSlot=c.e(),this.ariaLabel="",this.metaLead=null,this.borderOnHover=!0,this.clickCardLink=null,this.metaTrail=null,this.layout=h.props.layout.default,this.heading="",this.headinglevel=3,this.image={src:"",alt:""},this.imageShape="square",this.openLinkInNewTab=!1,this.padding=h.props.padding.default,this.skin=h.props.skin.default,this.subheading="",this.tagPosition="top",this.tags=[],this.slotController=new g.PktSlotController(this,this.defaultSlot)}connectedCallback(){super.connectedCallback()}render(){var r,n;const a={"pkt-card":!0,[`pkt-card--${this.skin}`]:this.skin,[`pkt-card--${this.layout}`]:this.layout,[`pkt-card--padding-${this.padding}`]:this.padding,"pkt-card--border-on-hover":this.borderOnHover},i=((r=this.ariaLabel)==null?void 0:r.trim())||(this.heading?`${this.heading} lenkekort`:"lenkekort"),s=((n=this.ariaLabel)==null?void 0:n.trim())||(this.heading?this.heading:"kort");return t.x`
       <article
         class=${l.e(a)}
         aria-label=${p.o(this.clickCardLink?i:s)}
@@ -70,7 +70,7 @@
                     skin=${p.o(i.skin)}
                     iconName=${p.o(i.iconName)}
                   >
-                    ${i.text}
+                    <span>${i.text}</span>
                   </pkt-tag>
                 `)}
             </div>

package/dist/{combobox-CijGa9Fr.cjs → combobox-BhcqC30d.cjs}

@@ -1,4 +1,4 @@
-"use strict";const a=require("./element-6DBpyGQm.cjs"),c=require("./if-defined-Cni-RHLS.cjs"),d=require("./state-DPobt-Yz.cjs"),r=require("./ref-iJtiv3o2.cjs"),O=require("./class-map-BBG2gMX4.cjs"),$=require("./repeat-CDsZqct8.cjs"),I=require("./input-element-C4xJoM-X.cjs"),y=require("./pkt-options-controller-CiuBG6Lt.cjs"),w=require("./pkt-slot-controller-BzddBp7z.cjs");require("./input-wrapper-CZ-a00V7.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-DPk3fpEg.cjs");require("./listbox-C4supLfR.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 I.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,...JSON.parse(JSON.stringify(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,...JSON.parse(JSON.stringify(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`
+"use strict";const a=require("./element-6DBpyGQm.cjs"),c=require("./if-defined-Cni-RHLS.cjs"),d=require("./state-DPobt-Yz.cjs"),r=require("./ref-iJtiv3o2.cjs"),O=require("./class-map-BBG2gMX4.cjs"),$=require("./repeat-CDsZqct8.cjs"),I=require("./input-element-C4xJoM-X.cjs"),y=require("./pkt-options-controller-CiuBG6Lt.cjs"),w=require("./pkt-slot-controller-BzddBp7z.cjs");require("./input-wrapper-CZ-a00V7.cjs");require("./icon-B_ryAy4Q.cjs");require("./tag-Bbs0U_Au.cjs");require("./listbox-C4supLfR.cjs");const C={displayValueAs:{default:"label"}},V={props:C};var R=Object.defineProperty,S=Object.getOwnPropertyDescriptor,o=(v,e,t,i)=>{for(var s=i>1?void 0:i?S(e,t):e,l=v.length-1,h;l>=0;l--)(h=v[l])&&(s=(i?h(e,t,s):h(s))||s);return i&&s&&R(e,t,s),s};exports.PktCombobox=class extends I.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=V.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,...JSON.parse(JSON.stringify(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")&&(Array.isArray(this.value)?this._value=this.value:this.value&&this.multiple?this._value=this.value.split(","):this.value?this._value=[this.value]:this._value=[],!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,...JSON.parse(JSON.stringify(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(h=>h.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 h=[...this._value];this._value=[...this._value,l.value],this.valueChanged(this._value,h)}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"&&(Array.isArray(this.value)?this._value=this.value:this.value&&this.multiple?this._value=this.value.split(","):this.value?this._value=[this.value]:this._value=[],!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}
@@ -105,12 +105,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 h;const l=this.findValueInOptions(s),n=(h=this.options.find(u=>u.value===s))==null?void 0:h.tagSkinColor;return a.x`
+        `}renderSingleOrMultipleValues(){const e=!this.multiple,t=this._editingSingleValue?null:this.renderValueTag(this.findValueInOptions(this._value[0])),i=$.c(this._value,s=>s,s=>{var n;const l=this.findValueInOptions(s),h=(n=this.options.find(u=>u.value===s))==null?void 0:n.tagSkinColor;return a.x`
           <pkt-tag
-            skin=${n||"blue-dark"}
+            skin=${h||"blue-dark"}
             ?closeTag=${!this.disabled}
             @close=${()=>this.handleTagRemove(s)}
           >
             ${this.renderValueTag(l)}
           </pkt-tag>
-        `});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);
+        `});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,h;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&&((h=e.target)==null?void 0:h.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 n=this.inputRef.value.value,u=this.findValueInOptions(n);!this._value.includes(n)&&!u?this.allowUserInput?this.addNewUserValue(n):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",":this.multiple&&(e.preventDefault(),this.addValue());break;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 h;const e=((h=this.inputRef.value)==null?void 0:h.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(n=>n.toLowerCase()===t),s=this._options.filter(n=>{var u;return((u=n.label)==null?void 0:u.toLowerCase().includes(t))??!1}),l=s.find(n=>{var u;return((u=n.label)==null?void 0:u.toLowerCase())===t||n.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,h=!(e!=null&&e.trim()),n=!this.multiple,u=this.multiple,x=this.isMaxItemsReached();let p=!1,f=!0,b="",m="";l||(!s&&this.allowUserInput&&!h?(this.addNewUserValue(e),b="Ny verdi lagt til",p=!u):!s&&!this.allowUserInput?(n&&this._value[0]&&this.removeValue(this._value[0]),f=!1,p=!0,b="Ingen treff i søket"):i?(this.removeValue(t),p=!0):h&&n?(this.removeAllSelected(),p=!0):n?(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):(n&&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=b,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/{combobox-Cwg9Rkmz.js → combobox-D9dGKWuZ.js}

@@ -3,13 +3,13 @@ import { o as f } from "./if-defined-CmuO4Vz9.js";
 import { r as c } from "./state-Bo2bck5_.js";
 import { e as _, n as v } from "./ref-BBYSqgeW.js";
 import { e as w } from "./class-map-BpTj9gtz.js";
-import { c as R } from "./repeat-C8BeHwYx.js";
-import { P as V } from "./input-element-NnrDmp4r.js";
+import { c as V } from "./repeat-C8BeHwYx.js";
+import { P as R } from "./input-element-NnrDmp4r.js";
 import { P as S } from "./pkt-options-controller-CZO1nxZ8.js";
 import { P as C } from "./pkt-slot-controller-BPGj-LC5.js";
 import "./input-wrapper-Dr__Sxql.js";
 import "./icon-CC1js8eR.js";
-import "./tag-BWm6s48d.js";
+import "./tag-DyXzTY68.js";
 import "./listbox-CLsSW32I.js";
 const A = {
   displayValueAs: {
@@ -18,43 +18,43 @@ const A = {
 }, T = {
   props: A
 };
-var M = Object.defineProperty, F = Object.getOwnPropertyDescriptor, o = (t, e, i, s) => {
-  for (var l = s > 1 ? void 0 : s ? F(e, i) : e, n = t.length - 1, a; n >= 0; n--)
-    (a = t[n]) && (l = (s ? a(e, i, l) : a(l)) || l);
-  return s && l && M(e, i, l), l;
+var M = Object.defineProperty, F = Object.getOwnPropertyDescriptor, o = (e, t, i, s) => {
+  for (var l = s > 1 ? void 0 : s ? F(t, i) : t, n = e.length - 1, a; n >= 0; n--)
+    (a = e[n]) && (l = (s ? a(t, i, l) : a(l)) || l);
+  return s && l && M(t, i, l), l;
 };
-let h = class extends V {
+let h = class extends R {
   constructor() {
     super(), this.helptextSlot = _(), 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 = T.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 = _(), this.arrowRef = _(), this.listboxRef = _(), this.focusRef = _(), this.optionTagRef = _(), this.optionsController = new S(this), this.slotController = new C(this, this.helptextSlot), this.slotController.skipOptions = !0;
   }
   // Lifecycle methods
   connectedCallback() {
-    var t;
-    if (super.connectedCallback(), document && document.body.addEventListener("click", (e) => {
-      this._isOptionsOpen && !this.contains(e.target) && this.handleFocusOut(e);
+    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 e = ((t = this.options) == null ? void 0 : t.filter((i) => i.userAdded)) || [];
-      this.options = [...e, ...JSON.parse(JSON.stringify(this.defaultOptions))], this._options = [...this.options];
+      const t = ((e = this.options) == null ? void 0 : e.filter((i) => i.userAdded)) || [];
+      this.options = [...t, ...JSON.parse(JSON.stringify(this.defaultOptions))], this._options = [...this.options];
     }
     if (this.optionsController.nodes.length) {
-      const e = [];
+      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 || ""), e.push(s);
-      }), e.length && (this.options = [...e], this._options = [...e]);
+        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(t) {
-    var e;
-    if (t.has("_value") && this.valueChanged(this._value, t.get("_value")), t.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()), t.has("defaultOptions") && this.defaultOptions.length) {
-      const i = ((e = this.options) == null ? void 0 : e.filter((s) => s.userAdded)) || [];
+  updated(e) {
+    var t;
+    if (e.has("_value") && this.valueChanged(this._value, e.get("_value")), e.has("value") && (Array.isArray(this.value) ? this._value = this.value : this.value && this.multiple ? this._value = this.value.split(",") : this.value ? this._value = [this.value] : this._value = [], !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, ...JSON.parse(JSON.stringify(this.defaultOptions))], this._options = [...this.options];
     }
-    if (t.has("options") && this.options.length) {
+    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)
       );
@@ -66,17 +66,17 @@ let h = class extends V {
         l.fulltext = l.value + l.label + (l.prefix || ""), l.selected = l.selected || this._value.includes(l.value);
       });
     }
-    t.has("_search") && this.dispatchEvent(
+    e.has("_search") && this.dispatchEvent(
       new CustomEvent("search", {
         detail: this._search,
         bubbles: !1
       })
-    ), super.updated(t);
+    ), super.updated(e);
   }
-  attributeChangedCallback(t, e, i) {
-    t === "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]])), t === "options" && (this._options = this.options, this._options.forEach((s) => {
+  attributeChangedCallback(e, t, i) {
+    e === "value" && (Array.isArray(this.value) ? this._value = this.value : this.value && this.multiple ? this._value = this.value.split(",") : this.value ? this._value = [this.value] : this._value = [], !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(t, e, i);
+    }), this._search = ""), super.attributeChangedCallback(e, t, i);
   }
   // Render methods
   render() {
@@ -204,7 +204,7 @@ let h = class extends V {
         `;
   }
   renderSingleOrMultipleValues() {
-    const t = !this.multiple, e = this._editingSingleValue ? null : this.renderValueTag(this.findValueInOptions(this._value[0])), i = R(
+    const e = !this.multiple, t = this._editingSingleValue ? null : this.renderValueTag(this.findValueInOptions(this._value[0])), i = V(
       this._value,
       (s) => s,
       (s) => {
@@ -221,33 +221,33 @@ let h = class extends V {
         `;
       }
     );
-    return t ? e : i;
+    return e ? t : i;
   }
-  renderValueTag(t) {
-    if (!t) return "";
+  renderValueTag(e) {
+    if (!e) return "";
     switch (this.displayValueAs) {
       case "prefixAndValue":
-        return d`<span data-focusfix=${this.id}>${t.prefix || ""} ${t.value}</span>`;
+        return d`<span data-focusfix=${this.id}>${e.prefix || ""} ${e.value}</span>`;
       case "value":
-        return d`<span data-focusfix=${this.id}>${t.value}</span>`;
+        return d`<span data-focusfix=${this.id}>${e.value}</span>`;
       case "label":
       default:
-        return d`<span data-focusfix=${this.id}>${t.label || t.value}</span>`;
+        return d`<span data-focusfix=${this.id}>${e.label || e.value}</span>`;
     }
   }
   // Event handlers
-  handleInput(t) {
-    if (t.stopPropagation(), t.stopImmediatePropagation(), this.disabled) return;
+  handleInput(e) {
+    if (e.stopPropagation(), e.stopImmediatePropagation(), this.disabled) return;
     this.touched = !0;
-    const e = t.target;
-    if (this._search = e.value, this.checkForMatches(), this.typeahead)
+    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());
           }
-        ), t.inputType !== "deleteContentBackward") {
+        ), e.inputType !== "deleteContentBackward") {
           const i = this._options.filter(
             (s) => {
               var l;
@@ -256,10 +256,10 @@ let h = class extends V {
           );
           if (i.length > 0 && this.inputRef.value && this.inputRef.value.type !== "hidden") {
             const s = i[0];
-            s != null && s.label && (e.value = s.label, window.setTimeout(
-              () => e.setSelectionRange(this._search.length, e.value.length),
+            s != null && s.label && (t.value = s.label, window.setTimeout(
+              () => t.setSelectionRange(this._search.length, t.value.length),
               0
-            ), e.selectionDirection = "backward");
+            ), t.selectionDirection = "backward");
           }
         }
       } else
@@ -268,15 +268,15 @@ let h = class extends V {
   handleFocus() {
     if (!this.disabled) {
       if (!this.multiple && this._value[0] && this.inputRef.value && this.inputRef.value.type !== "hidden") {
-        const t = this.findValueInOptions(this._value[0]);
-        this._editingSingleValue = !0, this.inputRef.value.value = this.displayValueAs === "label" && (t != null && t.label) ? t.label : this._value[0];
+        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(t) {
-    var e, i, s, l, n;
-    if (!this.disabled && ((i = (e = t.relatedTarget) == null ? void 0 : e.closest("pkt-combobox")) == null ? void 0 : i.id) !== this.id && ((l = (s = t.relatedTarget) == null ? void 0 : s.closest("pkt-combobox")) == null ? void 0 : l.id) !== this.id && ((n = t.target) == null ? void 0 : n.getAttribute("data-focusfix")) !== this.id && t.relatedTarget !== this.focusRef.value && t.relatedTarget !== this.inputRef.value && t.relatedTarget !== this.arrowRef.value && this._isOptionsOpen) {
+  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 a = this.inputRef.value.value, u = this.findValueInOptions(a);
         !this._value.includes(a) && !u ? this.allowUserInput ? this.addNewUserValue(a) : this.multiple || this.removeValue(this._value[0]) : u && !this._value.includes(u.value) && this.setSelected(u.value), this.inputRef.value.value = "";
@@ -287,66 +287,68 @@ let h = class extends V {
   handleBlur() {
     this._inputFocus = !1, this._editingSingleValue = !1, this.onBlur();
   }
-  handleInputClick(t) {
-    var e, i;
-    this.disabled || (t.currentTarget && t.currentTarget !== this.arrowRef.value && ((e = this.inputRef.value) == null ? void 0 : e.type) !== "hidden" ? (i = this.inputRef.value) == null || i.focus() : this.handleArrowClick(t));
+  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(t) {
-    var e, i;
-    this.disabled || t instanceof KeyboardEvent && t.key && t.key !== "Enter" && t.key !== " " && t.key !== "ArrowDown" || (t.stopImmediatePropagation(), t.preventDefault(), this._isOptionsOpen = !this._isOptionsOpen, this._isOptionsOpen ? (e = this.listboxRef.value) == null || e.focusFirstOrSelectedOption() : (i = this.arrowRef.value) == null || i.focus());
+  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(t) {
-    this.toggleValue(t.detail);
+  handleOptionToggled(e) {
+    this.toggleValue(e.detail);
   }
-  handleSearch(t) {
-    t.stopPropagation(), this._search = t.detail.toLowerCase();
+  handleSearch(e) {
+    e.stopPropagation(), this._search = e.detail.toLowerCase();
   }
-  handleInputKeydown(t) {
-    var e, i, s;
-    switch (t.key) {
+  handleInputKeydown(e) {
+    var t, i, s;
+    switch (e.key) {
       case ",":
+        this.multiple && (e.preventDefault(), this.addValue());
+        break;
       case "Enter":
-        t.preventDefault(), this.addValue();
+        e.preventDefault(), this.addValue();
         break;
       case "Backspace":
-        !this._search && ((e = this.inputRef.value) == null ? void 0 : e.type) === "hidden" && this.removeLastValue(t);
+        !this._search && ((t = this.inputRef.value) == null ? void 0 : t.type) === "hidden" && this.removeLastValue(e);
         break;
       case "Tab":
       case "ArrowDown":
-        t.shiftKey || ((i = this.listboxRef.value) == null || i.focusFirstOrSelectedOption(), t.preventDefault());
+        e.shiftKey || ((i = this.listboxRef.value) == null || i.focusFirstOrSelectedOption(), e.preventDefault());
         break;
       case "Escape":
-        this._isOptionsOpen = !1, (s = this.arrowRef.value) == null || s.focus(), t.preventDefault();
+        this._isOptionsOpen = !1, (s = this.arrowRef.value) == null || s.focus(), e.preventDefault();
         break;
     }
   }
-  handleTagRemove(t) {
-    this.removeSelected(t);
+  handleTagRemove(e) {
+    this.removeSelected(e);
   }
   blurInput() {
     this.inputRef.value && this.inputRef.value.matches(":focus") && this.inputRef.value.blur();
   }
   checkForMatches() {
     var n;
-    const t = ((n = this.inputRef.value) == null ? void 0 : n.value) || this._search || "", e = t.trim().toLowerCase() || "";
-    if (!e) {
+    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((a) => a.toLowerCase() === e), s = this._options.filter(
+    const i = this._value.find((a) => a.toLowerCase() === t), s = this._options.filter(
       (a) => {
         var u;
-        return ((u = a.label) == null ? void 0 : u.toLowerCase().includes(e)) ?? !1;
+        return ((u = a.label) == null ? void 0 : u.toLowerCase().includes(t)) ?? !1;
       }
     ), l = s.find(
       (a) => {
         var u;
-        return ((u = a.label) == null ? void 0 : u.toLowerCase()) === e || a.value.toLowerCase() === e;
+        return ((u = a.label) == null ? void 0 : u.toLowerCase()) === t || a.value.toLowerCase() === t;
       }
     );
     switch (!0) {
       case ((s.length === 0 || !l) && this.allowUserInput):
-        this._addValueText = t, this._userInfoMessage = "";
+        this._addValueText = e, this._userInfoMessage = "";
         break;
       case (s.length === 0 && !this.allowUserInput):
         this._addValueText = null, this._userInfoMessage = "Ingen match i søket";
@@ -361,41 +363,41 @@ let h = class extends V {
         this._addValueText = null, this._userInfoMessage = "";
     }
   }
-  findValueInOptions(t) {
-    return this.options.find((e) => e.value === t || e.label === t) || null;
+  findValueInOptions(e) {
+    return this.options.find((t) => t.value === e || t.label === e) || null;
   }
-  findIndexInOptions(t) {
-    return this._options.findIndex((e) => e.value === t || e.label === t);
+  findIndexInOptions(e) {
+    return this._options.findIndex((t) => t.value === e || t.label === e);
   }
   isMaxItemsReached() {
-    const t = this.maxlength !== null && this._value.length >= this.maxlength;
-    return t ? this._maxIsReached = !0 : this._maxIsReached = !1, t;
+    const e = this.maxlength !== null && this._value.length >= this.maxlength;
+    return e ? this._maxIsReached = !0 : this._maxIsReached = !1, e;
   }
-  toggleValue(t) {
+  toggleValue(e) {
     var $, I;
     if (this.disabled) return;
     this.touched = !0, this._userInfoMessage = "", this._addValueText = null;
-    const e = (($ = this.findValueInOptions(t)) == null ? void 0 : $.value) || null, i = this._value.includes(t || e || ""), s = !!e, l = ((I = this._options.find((m) => m.value === t)) == null ? void 0 : I.disabled) || !1, n = !(t != null && t.trim()), a = !this.multiple, u = this.multiple, O = this.isMaxItemsReached();
+    const t = (($ = this.findValueInOptions(e)) == null ? void 0 : $.value) || null, i = this._value.includes(e || t || ""), s = !!t, l = ((I = this._options.find((m) => m.value === e)) == null ? void 0 : I.disabled) || !1, n = !(e != null && e.trim()), a = !this.multiple, u = this.multiple, O = this.isMaxItemsReached();
     let p = !1, b = !0, g = "", x = "";
-    l || (!s && this.allowUserInput && !n ? (this.addNewUserValue(t), g = "Ny verdi lagt til", p = !u) : !s && !this.allowUserInput ? (a && this._value[0] && this.removeValue(this._value[0]), b = !1, p = !0, g = "Ingen treff i søket") : i ? (this.removeValue(e), p = !0) : n && a ? (this.removeAllSelected(), p = !0) : a ? (this._value[0] && this.removeSelected(this._value[0]), this.setSelected(e), p = !1, this.inputRef.value && this.inputRef.value.type !== "hidden" && (this.inputRef.value.value = "", this.inputRef.value.blur())) : u && !O ? (this.setSelected(e), p = !0) : u && O ? (this._userInfoMessage = "Maks antall valg nådd", b = !1, x = t) : (a && this.removeAllSelected(), this._userInfoMessage = "Ingen gyldig verdi valgt", b = !1, p = !0, x = t), this._isOptionsOpen = p, p || window.setTimeout(() => {
+    l || (!s && this.allowUserInput && !n ? (this.addNewUserValue(e), g = "Ny verdi lagt til", p = !u) : !s && !this.allowUserInput ? (a && this._value[0] && this.removeValue(this._value[0]), b = !1, p = !0, g = "Ingen treff i søket") : i ? (this.removeValue(t), p = !0) : n && a ? (this.removeAllSelected(), p = !0) : a ? (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 && !O ? (this.setSelected(t), p = !0) : u && O ? (this._userInfoMessage = "Maks antall valg nådd", b = !1, x = e) : (a && this.removeAllSelected(), this._userInfoMessage = "Ingen gyldig verdi valgt", b = !1, p = !0, x = e), this._isOptionsOpen = p, p || window.setTimeout(() => {
       var m;
       (m = this.focusRef.value) == null || m.focus();
     }, 0), this._userInfoMessage = g, this._search = x || "", this.resetComboboxInput(b), u && this.isMaxItemsReached());
   }
-  setSelected(t) {
-    if (!this._value.includes(t)) {
+  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 = t ? [...this._value, t] : this._value, this._options = this._options.map((e) => (e.value === t && (e.selected = !0), e)), this.resetComboboxInput(!0);
+      !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(t) {
-    if (!t) return;
-    this._value = this._value.filter((i) => i !== t);
-    const e = this.findValueInOptions(t);
-    e ? (e.selected = !1, e.userAdded ? (this._options = [...this._options.filter((i) => i.value !== t)], this.options = [...this.options.filter((i) => i.value !== t)]) : this._options = [...this._options, e]) : !t && !this.multiple && (this._options = this._options.map((i) => (i.selected = !1, i)));
+  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) {
@@ -403,48 +405,48 @@ let h = class extends V {
         this._userInfoMessage = "For mange valgt";
         return;
       }
-      this._value = this._options.map((t) => t.value), this._options = this._options.map((t) => (t.selected = !0, t)), this.requestUpdate();
+      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((t) => (t.selected = !1, t)), this._options = this._options.filter((t) => !t.userAdded), this.requestUpdate();
+    this._value = [], this._options = this._options.map((e) => (e.selected = !1, e)), this._options = this._options.filter((e) => !e.userAdded), this.requestUpdate();
   }
   addValue() {
-    var e;
-    const t = ((e = this.inputRef.value) == null ? void 0 : e.value.trim()) || "";
-    this._search = t, this.toggleValue(t);
+    var t;
+    const e = ((t = this.inputRef.value) == null ? void 0 : t.value.trim()) || "";
+    this._search = e, this.toggleValue(e);
   }
-  removeValue(t) {
-    this._value = this.multiple ? this._value.filter((e) => e !== t) : [], this.removeSelected(t);
+  removeValue(e) {
+    this._value = this.multiple ? this._value.filter((t) => t !== e) : [], this.removeSelected(e);
   }
-  addNewUserValue(t) {
-    if (!t || t.trim() === "") return;
+  addNewUserValue(e) {
+    if (!e || e.trim() === "") return;
     if (!this.multiple)
-      this._value[0] && this.removeSelected(this._value[0]), this._value = [t], this._isOptionsOpen = !1, this.blurInput();
-    else if (!this.findValueInOptions(t)) {
+      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, t];
+      this._value = [...this._value, e];
     }
-    const e = { value: t, label: t, userAdded: !0 };
-    this.options = [e, ...this.options], this._options = [e, ...this._options], this.setSelected(t), this.requestUpdate();
+    const t = { value: e, label: e, userAdded: !0 };
+    this.options = [t, ...this.options], this._options = [t, ...this._options], this.setSelected(e), this.requestUpdate();
   }
-  resetComboboxInput(t = !0) {
-    if (this._addValueText = null, this.inputRef.value && this.inputRef.value.type !== "hidden" && t)
+  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 e = this.findValueInOptions(this._value[0]);
+        const t = this.findValueInOptions(this._value[0]);
         window.setTimeout(() => {
-          !this.inputRef.value || this.inputRef.value.type === "hidden" || (this.inputRef.value.value = this.displayValueAs === "label" && (e != null && e.label) ? e.label : this._value[0] || "");
+          !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(t) {
+  removeLastValue(e) {
     if (this._value.length === 0) return;
-    t.preventDefault();
-    const e = this._value[this._value.length - 1];
-    e && this.removeSelected(e), this.isMaxItemsReached();
+    e.preventDefault();
+    const t = this._value[this._value.length - 1];
+    t && this.removeSelected(t), this.isMaxItemsReached();
   }
 };
 o([