@oslokommune/punkt-elements 16.0.5 → 16.2.0

package/dist/{card-CmfUyl_s.js → card-DvgCTN4B.js}

@@ -1,26 +1,24 @@
 import { e as c } from "./class-map-3ADKve8g.js";
 import { o as k } from "./if-defined-rXcLNTzN.js";
-import { P as u, A as d, b as t, n as r, t as m } from "./element-CV9utnHJ.js";
-import { P as $ } from "./pkt-slot-controller-D7CrjM52.js";
-import { e as y, n as _ } from "./ref-Dma3n3i8.js";
+import { A as d, b as e, n as r, t as u } from "./element-CV9utnHJ.js";
+import { P as m, s as $ } from "./element-with-slot-1djk8KXi.js";
 import "./icon-D0IQAVwS.js";
-import "./tag-DZPqFiem.js";
+import "./tag-CIWBLpjv.js";
 import "./heading-D9R5UBcv.js";
-const b = { layout: { default: "vertical" }, skin: { type: ["outlined", "outlined-beige", "gray", "blue", "beige", "green"], default: "outlined" }, padding: { default: "default" } }, p = {
-  props: b
+const y = { layout: { default: "vertical" }, skin: { type: ["outlined", "outlined-beige", "gray", "blue", "beige", "green"], default: "outlined" }, padding: { default: "default" } }, o = {
+  props: y
 };
-var f = Object.defineProperty, S = Object.getOwnPropertyDescriptor, i = (e, s, l, o) => {
-  for (var n = o > 1 ? void 0 : o ? S(s, l) : s, h = e.length - 1, g; h >= 0; h--)
-    (g = e[h]) && (n = (o ? g(s, l, n) : g(n)) || n);
-  return o && n && f(s, l, n), n;
+var _ = Object.defineProperty, b = Object.getOwnPropertyDescriptor, i = (t, s, l, p) => {
+  for (var n = p > 1 ? void 0 : p ? b(s, l) : s, h = t.length - 1, g; h >= 0; h--)
+    (g = t[h]) && (n = (p ? g(s, l, n) : g(n)) || n);
+  return p && n && _(s, l, n), n;
 };
-let a = class extends u {
-  //Constructor
+let a = class extends m {
   constructor() {
-    super(), this.defaultSlot = y(), this.ariaLabel = "", this.metaLead = null, this.borderOnHover = !0, this.clickCardLink = null, this.metaTrail = null, this.layout = p.props.layout.default, this.heading = "", this.headinglevel = 3, this.image = {
+    super(...arguments), this.ariaLabel = "", this.metaLead = null, this.borderOnHover = !0, this.clickCardLink = null, this.metaTrail = null, this.layout = o.props.layout.default, this.heading = "", this.headinglevel = 3, this.image = {
       src: "",
       alt: ""
-    }, this.imageShape = "square", this.openLinkInNewTab = !1, this.padding = p.props.padding.default, this.skin = p.props.skin.default, this.subheading = "", this.tagPosition = "top", this.tags = [], this.slotController = new $(this, this.defaultSlot);
+    }, this.imageShape = "square", this.openLinkInNewTab = !1, this.padding = o.props.padding.default, this.skin = o.props.skin.default, this.subheading = "", this.tagPosition = "top", this.tags = [];
   }
   connectedCallback() {
     super.connectedCallback();
@@ -29,17 +27,17 @@ let a = class extends u {
   // Main render method
   // prettier-ignore
   render() {
-    var o, n;
-    const e = {
+    var p, n;
+    const t = {
       "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"), l = ((n = this.ariaLabel) == null ? void 0 : n.trim()) || (this.heading ? this.heading : "kort");
-    return t`
+    }, s = ((p = this.ariaLabel) == null ? void 0 : p.trim()) || (this.heading ? `${this.heading} lenkekort` : "lenkekort"), l = ((n = this.ariaLabel) == null ? void 0 : n.trim()) || (this.heading ? this.heading : "kort");
+    return e`
       <article
-        class=${c(e)}
+        class=${c(t)}
         aria-label=${k(this.clickCardLink ? s : l)}
       >
         ${this.renderImage()}
@@ -55,13 +53,13 @@ let a = class extends u {
   }
   // Render methods for different parts of the card
   renderImage() {
-    const e = {
+    const t = {
       "pkt-card__image": !0,
       [`pkt-card__image-${this.imageShape}`]: this.imageShape
     };
-    return t`
-      ${this.image.src && t`
-        <div class=${c(e)}>
+    return e`
+      ${this.image.src && e`
+        <div class=${c(t)}>
           <img src=${this.image.src} alt=${this.image.alt || ""} />
         </div>
       `}
@@ -70,8 +68,8 @@ let a = class extends u {
   // Do not render heading if link is present, render link heading instead
   // Combine the rendering for headings into a renderHeader method
   renderHeading() {
-    return t`
-      ${this.heading && !this.clickCardLink ? t`
+    return e`
+      ${this.heading && !this.clickCardLink ? e`
             <pkt-heading
               class="pkt-card__heading"
               .level=${this.headinglevel || 3}
@@ -85,8 +83,8 @@ let a = class extends u {
     `;
   }
   renderLinkHeading() {
-    return t`
-      ${this.clickCardLink ? t`
+    return e`
+      ${this.clickCardLink ? e`
             <pkt-heading
               class="pkt-card__link-heading pkt-card__heading"
               .level=${this.headinglevel || 3}
@@ -105,16 +103,16 @@ let a = class extends u {
     `;
   }
   renderSubheading() {
-    return t`
-      ${this.subheading ? t` <p class="pkt-card__subheading ">${this.subheading}</p> ` : d}
+    return e`
+      ${this.subheading ? e` <p class="pkt-card__subheading ">${this.subheading}</p> ` : d}
     `;
   }
   // Render header
   // prettier-ignore
   renderHeader() {
-    const e = !!this.heading || !!this.subheading;
-    return t`
-      ${e ? t`
+    const t = !!this.heading || !!this.subheading;
+    return e`
+      ${t ? e`
             <header class="pkt-card__header">
               ${this.renderHeading()} 
               ${this.renderLinkHeading()} 
@@ -124,19 +122,19 @@ let a = class extends u {
     `;
   }
   renderTags() {
-    const e = {
+    const t = {
       "pkt-card__tags": !0,
       [`pkt-card__tags-${this.tagPosition}`]: this.tagPosition
     };
-    return t`
-      ${this.tags.length > 0 ? t`
+    return e`
+      ${this.tags.length > 0 ? e`
             <div
-              class=${c(e)}
+              class=${c(t)}
               role="list"
               aria-label=${this.tags.length > 1 ? "merkelapper" : "merkelapp"}
             >
               ${this.tags.map(
-      (s) => t`
+      (s) => e`
                   <pkt-tag
                     role="listitem"
                     textStyle="normal-text"
@@ -153,16 +151,14 @@ let a = class extends u {
     `;
   }
   renderSlot() {
-    return t`
-      ${this.defaultSlot && t`<section class="pkt-card__content" ${_(this.defaultSlot)}></section>`}
-    `;
+    return e`<section class="pkt-card__content">${$(this)}</section>`;
   }
   renderMetadata() {
-    return t`
-      ${this.metaLead || this.metaTrail ? t`
+    return e`
+      ${this.metaLead || this.metaTrail ? e`
             <footer class="pkt-card__metadata">
-              ${this.metaLead ? t`<span class="pkt-card__metadata-lead">${this.metaLead}</span>` : d}
-              ${this.metaTrail ? t`<span class="pkt-card__metadata-trail">${this.metaTrail}</span>` : d}
+              ${this.metaLead ? e`<span class="pkt-card__metadata-lead">${this.metaLead}</span>` : d}
+              ${this.metaTrail ? e`<span class="pkt-card__metadata-trail">${this.metaTrail}</span>` : d}
             </footer>
           ` : d}
     `;
@@ -208,13 +204,13 @@ i([
   r({
     type: String,
     converter: {
-      fromAttribute: (e) => {
-        const s = p.props.skin.type;
-        return e && s.includes(e) ? e : (e && !s.includes(e) && console.warn(
-          `Invalid skin value "${e}". Using default skin "${p.props.skin.default}".`
-        ), p.props.skin.default);
+      fromAttribute: (t) => {
+        const s = o.props.skin.type;
+        return t && s.includes(t) ? t : (t && !s.includes(t) && console.warn(
+          `Invalid skin value "${t}". Using default skin "${o.props.skin.default}".`
+        ), o.props.skin.default);
       },
-      toAttribute: (e) => e
+      toAttribute: (t) => t
     }
   })
 ], a.prototype, "skin", 2);
@@ -228,7 +224,7 @@ i([
   r({ type: Array })
 ], a.prototype, "tags", 2);
 a = i([
-  m("pkt-card")
+  u("pkt-card")
 ], a);
 export {
   a as P

package/dist/{checkbox-D6nltMuc.js → checkbox-CbIUMIYt.js}

@@ -1,6 +1,6 @@
 import { A as r, b as p, n as s, t as d } from "./element-CV9utnHJ.js";
-import { P as k } from "./input-element-BGNbdzy2.js";
-import { e as f, n as b } from "./ref-Dma3n3i8.js";
+import { P as k } from "./input-element-n5U38pZ1.js";
+import { e as f, n as b } from "./ref-DBGHvw2G.js";
 import { e as u } from "./class-map-3ADKve8g.js";
 var g = Object.defineProperty, m = Object.getOwnPropertyDescriptor, i = (t, a, n, l) => {
   for (var h = l > 1 ? void 0 : l ? m(a, n) : a, c = t.length - 1, o; c >= 0; c--)

package/dist/{checkbox-Cpyay9_l.cjs → checkbox-mmn3v9ry.cjs}

@@ -1,4 +1,4 @@
-"use strict";const t=require("./element-CMTfByxQ.cjs"),o=require("./input-element-CSDVA3Y6.cjs"),r=require("./ref-CxLwrCxt.cjs"),p=require("./class-map-Bokp1SoS.cjs");var u=Object.defineProperty,d=Object.getOwnPropertyDescriptor,i=(l,e,h,a)=>{for(var s=a>1?void 0:a?d(e,h):e,c=l.length-1,n;c>=0;c--)(n=l[c])&&(s=(a?n(e,h,s):n(s))||s);return a&&s&&u(e,h,s),s};exports.PktCheckbox=class extends o.PktInputElement{constructor(){super(...arguments),this.inputRef=r.e(),this.value="",this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.isSwitch=!1,this.labelPosition="right",this.hideLabel=!1,this.checked=null,this.indeterminate=!1,this.type="checkbox",this.tagText=null,this.optionalTag=!1,this.optionalText="Valgfritt",this.requiredTag=!1,this.requiredText="Må fylles ut"}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,h,a){e==="defaultChecked"&&!this.checked&&(this.checked=this.defaultChecked),e==="checked"&&(this.checked=this.checked===""||this.checked==="true"||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e==="indeterminate"&&(this.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,h,a)}firstUpdated(e){e.has("defaultChecked")&&!this.checked&&(this.checked=this.defaultChecked),this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0),super.firstUpdated(e)}updated(e){e.has("defaultChecked")&&!this.checked&&(this.checked=this.defaultChecked),e.has("checked")&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===""||this.checked==="true"||this.checked===!0),e.has("indeterminate")&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0),super.updated(e)}render(){const e=p.e({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),h=p.e({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=p.e({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-input-check__input-label--left":this.labelPosition==="left","pkt-input-check__input-label--right":this.labelPosition==="right","pkt-sr-only":this.hideLabel}),s="pkt-tag pkt-tag--small pkt-tag--thin-text",c=()=>t.b`
+"use strict";const t=require("./element-CMTfByxQ.cjs"),o=require("./input-element-Xe9FTi2a.cjs"),r=require("./ref-DahIePMT.cjs"),p=require("./class-map-Bokp1SoS.cjs");var u=Object.defineProperty,d=Object.getOwnPropertyDescriptor,i=(l,e,h,a)=>{for(var s=a>1?void 0:a?d(e,h):e,c=l.length-1,n;c>=0;c--)(n=l[c])&&(s=(a?n(e,h,s):n(s))||s);return a&&s&&u(e,h,s),s};exports.PktCheckbox=class extends o.PktInputElement{constructor(){super(...arguments),this.inputRef=r.e(),this.value="",this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.isSwitch=!1,this.labelPosition="right",this.hideLabel=!1,this.checked=null,this.indeterminate=!1,this.type="checkbox",this.tagText=null,this.optionalTag=!1,this.optionalText="Valgfritt",this.requiredTag=!1,this.requiredText="Må fylles ut"}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,h,a){e==="defaultChecked"&&!this.checked&&(this.checked=this.defaultChecked),e==="checked"&&(this.checked=this.checked===""||this.checked==="true"||this.checked===!0,this.inputRef.value&&(this.inputRef.value.checked=this.checked)),e==="indeterminate"&&(this.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0,this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate)),super.attributeChangedCallback(e,h,a)}firstUpdated(e){e.has("defaultChecked")&&!this.checked&&(this.checked=this.defaultChecked),this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0),super.firstUpdated(e)}updated(e){e.has("defaultChecked")&&!this.checked&&(this.checked=this.defaultChecked),e.has("checked")&&this.inputRef.value&&(this.inputRef.value.checked=this.checked===""||this.checked==="true"||this.checked===!0),e.has("indeterminate")&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate===""||this.indeterminate==="true"||this.indeterminate===!0),super.updated(e)}render(){const e=p.e({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),h=p.e({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=p.e({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-input-check__input-label--left":this.labelPosition==="left","pkt-input-check__input-label--right":this.labelPosition==="right","pkt-sr-only":this.hideLabel}),s="pkt-tag pkt-tag--small pkt-tag--thin-text",c=()=>t.b`
         ${this.tagText?t.b`<span class=${s+" pkt-tag--gray"}>${this.tagText}</span>`:t.A}
         ${this.optionalTag?t.b`<span class=${s+" pkt-tag--blue-light"}>${this.optionalText}</span>`:t.A}
         ${this.requiredTag?t.b`<span class=${s+" pkt-tag--beige"}>${this.requiredText}</span>`:t.A}

package/dist/{combobox-TKTemUxN.js → combobox-CwW0md6G.js}

@@ -1,16 +1,16 @@
 import { n as r, A as m, b as c, t as M } from "./element-CV9utnHJ.js";
 import { o as u } from "./if-defined-rXcLNTzN.js";
-import { e as y, n as b } from "./ref-Dma3n3i8.js";
+import { e as I, n as y } from "./ref-DBGHvw2G.js";
 import { e as w } from "./class-map-3ADKve8g.js";
 import { c as P } from "./repeat-DnlRNf63.js";
-import { f, g as B, b as U, i as k, a as E, c as R } from "./listbox-CS4WQOuf.js";
+import { f, g as B, b as U, i as O, a as E, c as R } from "./listbox-CS4WQOuf.js";
+import { s as q } from "./element-with-slot-1djk8KXi.js";
 import { r as v } from "./state-l4hGZdFJ.js";
-import { P as q } from "./input-element-BGNbdzy2.js";
-import { P as N } from "./pkt-options-controller-Z-bPox7n.js";
-import { P as L } from "./pkt-slot-controller-D7CrjM52.js";
-import "./input-wrapper-CaUY90qz.js";
+import { P as N } from "./input-element-n5U38pZ1.js";
+import { P as L } from "./pkt-options-controller-W4ITGQy9.js";
+import "./input-wrapper-B__6jW4U.js";
 import "./icon-D0IQAVwS.js";
-import "./tag-DZPqFiem.js";
+import "./tag-CIWBLpjv.js";
 const j = (i, t, e) => {
   switch (i) {
     case ",":
@@ -38,10 +38,10 @@ const j = (i, t, e) => {
   userInfoMessage: "",
   shouldRemoveValue: !l && !!t[0],
   shouldResetInput: !0
-}, $ = (i, t, e) => {
+}, k = (i, t, e) => {
   const s = f(t, i);
   return e === "label" && (s != null && s.label) ? s.label : i;
-}, x = {
+}, b = {
   markOptionSelected(i, t) {
     if (t) {
       for (const e of i)
@@ -113,9 +113,9 @@ var H = Object.defineProperty, h = (i, t, e, s) => {
     (o = i[a]) && (l = o(t, e, l) || l);
   return l && H(t, e, l), l;
 };
-class n extends q {
+class n extends N {
   constructor() {
-    super(), this.helptextSlot = y(), 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 = J.props.displayValueAs.default, this.tagPlacement = null, this.isOpen = !1, this._options = [], this._value = [], this._isOptionsOpen = !1, this._userInfoMessage = "", this._addValueText = null, this._maxIsReached = !1, this._search = "", this._inputFocus = !1, this._internalValueSync = !1, this._optionsFromSlot = !1, this._lastSlotGeneration = 0, this._suppressNextOpen = !1, this.inputRef = y(), this.triggerRef = y(), this.listboxRef = y(), this.optionsController = new N(this), this.slotController = new L(this, this.helptextSlot), this.slotController.skipOptions = !0;
+    super(), 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 = J.props.displayValueAs.default, this.tagPlacement = null, this.isOpen = !1, this._options = [], this._value = [], this._isOptionsOpen = !1, this._userInfoMessage = "", this._addValueText = null, this._maxIsReached = !1, this._search = "", this._inputFocus = !1, this._internalValueSync = !1, this._optionsFromSlot = !1, this._lastSlotGeneration = 0, this._suppressNextOpen = !1, this.inputRef = I(), this.triggerRef = I(), this.listboxRef = I(), this.optionsController = new L(this);
   }
   get _hasTextInput() {
     return this.typeahead || this.allowUserInput;
@@ -142,7 +142,7 @@ class n extends q {
    * Updates the _maxIsReached state flag.
    */
   updateMaxReached() {
-    this._maxIsReached = k(this._value.length, this.maxlength);
+    this._maxIsReached = O(this._value.length, this.maxlength);
   }
   /**
    * Syncs the public value property from internal _value state and dispatches
@@ -239,26 +239,26 @@ class z extends n {
     var T, S;
     if (this.disabled) return;
     this.touched = !0, this._userInfoMessage = "", this._addValueText = null;
-    const e = ((T = f(this.options, t)) == null ? void 0 : T.value) || null, s = this._value.includes(t || e || ""), l = !!e, a = ((S = this._options.find((D) => D.value === t)) == null ? void 0 : S.disabled) || !1, o = !(t != null && t.trim()), p = !this.multiple, d = this.multiple, V = k(this._value.length, this.maxlength);
-    let _ = !1, O = !0, g = "", I = "";
-    a || (!l && this.allowUserInput && !o ? (this.addNewUserValue(t), g = "Ny verdi lagt til", _ = d) : !l && !this.allowUserInput ? (p && this._value[0] && this.removeValue(this._value[0]), O = !1, _ = !0, g = "Ingen treff i søket") : s ? (this.removeValue(e), _ = !0, p && this._hasTextInput && this.inputRef.value && this.inputRef.value.type !== "hidden" && (this.inputRef.value.value = "")) : o && p ? (this.removeAllSelected(), _ = !0) : p ? (this._value[0] && this.removeSelected(this._value[0]), this.setSelected(e), _ = !1) : d && !V ? (this.setSelected(e), _ = !0) : d && V ? (g = "Maks antall valg nådd", O = !1, I = t) : (p && this.removeAllSelected(), g = "Ingen gyldig verdi valgt", O = !1, _ = !0, I = t), this._isOptionsOpen = _, _ || (p && this._hasTextInput && (this._suppressNextOpen = !0), window.setTimeout(() => {
+    const e = ((T = f(this.options, t)) == null ? void 0 : T.value) || null, s = this._value.includes(t || e || ""), l = !!e, a = ((S = this._options.find((D) => D.value === t)) == null ? void 0 : S.disabled) || !1, o = !(t != null && t.trim()), p = !this.multiple, d = this.multiple, V = O(this._value.length, this.maxlength);
+    let _ = !1, x = !0, g = "", $ = "";
+    a || (!l && this.allowUserInput && !o ? (this.addNewUserValue(t), g = "Ny verdi lagt til", _ = d) : !l && !this.allowUserInput ? (p && this._value[0] && this.removeValue(this._value[0]), x = !1, _ = !0, g = "Ingen treff i søket") : s ? (this.removeValue(e), _ = !0, p && this._hasTextInput && this.inputRef.value && this.inputRef.value.type !== "hidden" && (this.inputRef.value.value = "")) : o && p ? (this.removeAllSelected(), _ = !0) : p ? (this._value[0] && this.removeSelected(this._value[0]), this.setSelected(e), _ = !1) : d && !V ? (this.setSelected(e), _ = !0) : d && V ? (g = "Maks antall valg nådd", x = !1, $ = t) : (p && this.removeAllSelected(), g = "Ingen gyldig verdi valgt", x = !1, _ = !0, $ = t), this._isOptionsOpen = _, _ || (p && this._hasTextInput && (this._suppressNextOpen = !0), window.setTimeout(() => {
       this.focusTrigger();
-    }, 0)), this._userInfoMessage = g, this._search = I || "", this.resetComboboxInput(O), d && this.updateMaxReached());
+    }, 0)), this._userInfoMessage = g, this._search = $ || "", this.resetComboboxInput(x), d && this.updateMaxReached());
   }
   setSelected(t) {
     if (!this._value.includes(t)) {
-      if (this.multiple && k(this._value.length, this.maxlength)) {
+      if (this.multiple && O(this._value.length, this.maxlength)) {
         this._userInfoMessage = "Maks antall valg nådd";
         return;
       }
-      !this.multiple && this.removeAllSelected(), this._value = t ? [...this._value, t] : this._value, x.markOptionSelected(this._options, t), this.resetComboboxInput(!0);
+      !this.multiple && this.removeAllSelected(), this._value = t ? [...this._value, t] : this._value, b.markOptionSelected(this._options, t), this.resetComboboxInput(!0);
     }
   }
   removeSelected(t) {
     if (!t) return;
     this._value = this._value.filter((s) => s !== t);
     const e = f(this.options, t);
-    e && (x.markOptionDeselected(this.options, t), e.userAdded ? (this._options = [...this._options.filter((s) => s.value !== t)], this.options = [...this.options.filter((s) => s.value !== t)]) : this._options.some((s) => s.value === t) || (this._options = [...this._options, e]));
+    e && (b.markOptionDeselected(this.options, t), e.userAdded ? (this._options = [...this._options.filter((s) => s.value !== t)], this.options = [...this.options.filter((s) => s.value !== t)]) : this._options.some((s) => s.value === t) || (this._options = [...this._options, e]));
   }
   addAllOptions() {
     if (this.multiple) {
@@ -266,11 +266,11 @@ class z extends n {
         this._userInfoMessage = "For mange valgt";
         return;
       }
-      this._value = this._options.map((t) => t.value), x.markAllSelected(this._options), this.requestUpdate();
+      this._value = this._options.map((t) => t.value), b.markAllSelected(this._options), this.requestUpdate();
     }
   }
   removeAllSelected() {
-    this._value = [], x.markAllDeselected(this._options), this._options = x.removeUserAddedOptions(this._options), this.requestUpdate();
+    this._value = [], b.markAllDeselected(this._options), this._options = b.removeUserAddedOptions(this._options), this.requestUpdate();
   }
   addValue() {
     var e;
@@ -289,7 +289,7 @@ class z extends n {
     if (!this.multiple)
       this._value[0] && this.removeSelected(this._value[0]), this._value = [t];
     else if (!f(this.options, t)) {
-      if (k(this._value.length, this.maxlength)) return;
+      if (O(this._value.length, this.maxlength)) return;
       this._value = [...this._value, t];
     }
     const e = { value: t, label: t, userAdded: !0, selected: !0 };
@@ -298,7 +298,7 @@ class z extends n {
     }, 0)), this.requestUpdate();
   }
   resetComboboxInput(t = !0) {
-    this._addValueText = null, this.inputRef.value && this.inputRef.value.type !== "hidden" && t && (this._search = "", this.multiple ? this.inputRef.value.value = "" : (this.inputRef.value.value = this._value[0] ? $(this._value[0], this.options, this.displayValueAs) : "", this._userInfoMessage = "")), this._options = [...this.options];
+    this._addValueText = null, this.inputRef.value && this.inputRef.value.type !== "hidden" && t && (this._search = "", this.multiple ? this.inputRef.value.value = "" : (this.inputRef.value.value = this._value[0] ? k(this._value[0], this.options, this.displayValueAs) : "", this._userInfoMessage = "")), this._options = [...this.options];
   }
   removeLastValue(t) {
     if (this._value.length === 0) return;
@@ -328,7 +328,7 @@ class Q extends z {
         this._suppressNextOpen = !1, this._inputFocus = !0, this.requestUpdate();
         return;
       }
-      !this.multiple && this._value[0] && this.inputRef.value && this.inputRef.value.type !== "hidden" && (this.inputRef.value.value = $(
+      !this.multiple && this._value[0] && this.inputRef.value && this.inputRef.value.type !== "hidden" && (this.inputRef.value.value = k(
         this._value[0],
         this.options,
         this.displayValueAs
@@ -375,7 +375,7 @@ class Q extends z {
         const e = f(this.options, t);
         e && e.value !== this._value[0] ? (this._value[0] && this.removeSelected(this._value[0]), this.setSelected(e.value)) : !e && this.allowUserInput && (this._value[0] && this.removeSelected(this._value[0]), this.addNewUserValue(t));
       }
-      !this.multiple && this._value[0] ? this.inputRef.value.value = $(
+      !this.multiple && this._value[0] ? this.inputRef.value.value = k(
         this._value[0],
         this.options,
         this.displayValueAs
@@ -599,7 +599,7 @@ let F = class extends Q {
         bubbles: !1
       })
     ), !this._isOptionsOpen && !this.multiple && this._hasTextInput && this.inputRef.value && this.inputRef.value.type !== "hidden") {
-      const l = this._value[0] ? $(this._value[0], this.options, this.displayValueAs) : "";
+      const l = this._value[0] ? k(this._value[0], this.options, this.displayValueAs) : "";
       this.inputRef.value.value !== l && (this.inputRef.value.value = l);
     }
     super.updated(i);
@@ -647,7 +647,7 @@ let F = class extends Q {
         class="pkt-combobox__wrapper"
         @labelClick=${this.handleInputClick}
       >
-        <div class="pkt-contents" ${b(this.helptextSlot)} name="helptext" slot="helptext"></div>
+        <div class="pkt-contents" slot="helptext">${q(this, "helptext")}</div>
         <div class="pkt-combobox" @focusout=${this.handleFocusOut}>
           <div
             class=${w({
@@ -674,7 +674,7 @@ let F = class extends Q {
             tabindex=${this._hasTextInput || this.disabled ? "-1" : "0"}
             @click=${this.handleInputClick}
             @keydown=${this._hasTextInput ? m : this.handleSelectOnlyKeydown}
-            ${b(this.triggerRef)}
+            ${y(this.triggerRef)}
           >
             ${!this._hasTextInput && this.placeholder && (!this._value.length || this.multiple && this.tagPlacement == "outside") && !this._inputFocus ? c`<span class="pkt-combobox__placeholder" @click=${this.handlePlaceholderClick}
                   >${this.placeholder}</span
@@ -709,7 +709,7 @@ let F = class extends Q {
             @tab-close=${() => this.closeAndProcessInput()}
             .searchValue=${this._search || null}
             .maxLength=${this.maxlength || 0}
-            ${b(this.listboxRef)}
+            ${y(this.listboxRef)}
           ></pkt-listbox>
         </div>
 
@@ -746,7 +746,7 @@ let F = class extends Q {
       this._value[0] && f(this.options, this._value[0]) ? `${this.id}-listbox-${R(this._options, this._value[0])}` : void 0
     )}
               aria-description=${u(this._selectionDescription || void 0)}
-              ${b(this.inputRef)}
+              ${y(this.inputRef)}
             />
           </div>
         ` : c`
@@ -755,7 +755,7 @@ let F = class extends Q {
             id="${this.id}-input"
             name=${(this.name || this.id) + "-input"}
             .value=${this._value.join(",")}
-            ${b(this.inputRef)}
+            ${y(this.inputRef)}
           />
         `;
   }

package/dist/combobox-TKL44xnV.cjs

@@ -0,0 +1,135 @@
+"use strict";const o=require("./element-CMTfByxQ.cjs"),d=require("./if-defined-hKKmbsI8.cjs"),b=require("./ref-DahIePMT.cjs"),V=require("./class-map-Bokp1SoS.cjs"),S=require("./repeat-C-FJ2vfy.cjs"),u=require("./listbox-OAVh_U7u.cjs"),R=require("./element-with-slot-yT8k1Z37.cjs"),v=require("./state-BNgpvY-A.cjs"),w=require("./input-element-Xe9FTi2a.cjs"),C=require("./pkt-options-controller-DIeKSpWv.cjs");require("./input-wrapper-BdFdJU-k.cjs");require("./icon-Dj0oZZSa.cjs");require("./tag-DeE1OpmF.cjs");const F=(a,t,e)=>{switch(a){case",":return e?"addValue":null;case"Enter":return"addValue";case"Tab":case"ArrowDown":return t?null:"focusListbox";case"Escape":return"closeOptions";default:return null}},M=(a,t,e,s,i)=>{if(!a)return{action:"none",value:null};const l=u.findOptionByValue(e,a);return!t.includes(a)&&!l?s?{action:"addUserValue",value:a}:i?{action:"none",value:null}:{action:"removeValue",value:t[0]}:l&&!t.includes(l.value)?{action:"selectOption",value:l.value}:{action:"none",value:null}},U=(a,t,e,s,i)=>a.trim().toLowerCase()?{...u.getSearchInfoMessage(a,t,e,s),shouldRemoveValue:!1,shouldResetInput:!1}:{addValueText:null,userInfoMessage:"",shouldRemoveValue:!i&&!!t[0],shouldResetInput:!0},O=(a,t,e)=>{const s=u.findOptionByValue(t,a);return e==="label"&&(s!=null&&s.label)?s.label:a},m={markOptionSelected(a,t){if(t){for(const e of a)if(e.value===t){e.selected=!0;break}}},markOptionDeselected(a,t){if(t){for(const e of a)if(e.value===t){e.selected=!1;break}}},markAllSelected(a){for(const t of a)t.selected=!0},markAllDeselected(a){for(const t of a)t.selected=!1},removeUserAddedOptions(a){return a.filter(t=>!t.userAdded)}},A={parseOptionsFromSlot(a){const t=[];return a.forEach(e=>{if(!e.textContent&&!e.getAttribute("value"))return;const s={value:e.getAttribute("value")||e.textContent||"",label:e.textContent||e.getAttribute("value")||""};e.getAttribute("data-prefix")&&(s.prefix=e.getAttribute("data-prefix")||void 0),e.getAttribute("tagskincolor")&&(s.tagSkinColor=e.getAttribute("tagskincolor")),e.getAttribute("description")&&(s.description=e.getAttribute("description")||void 0),s.fulltext=u.buildFulltext(s),t.push(s)}),t}},k={syncOptionsWithValues(a,t){const e=[...t];return a.forEach(s=>{s.value&&!s.label&&(s.label=s.value),s.selected&&!e.includes(s.value)&&e.push(s.value),s.fulltext=u.buildFulltext(s),s.selected=s.selected||e.includes(s.value)}),{options:a,newValues:e}},mergeWithUserAdded(a,t){return[...t.filter(i=>(i==null?void 0:i.userAdded)&&i.selected).filter(i=>!(Array.isArray(a)?a:[]).some(l=>l.value===i.value)),...a]}},D={displayValueAs:{default:"label"}},q={props:D};var P=Object.defineProperty,r=(a,t,e,s)=>{for(var i=void 0,l=a.length-1,n;l>=0;l--)(n=a[l])&&(i=n(t,e,i)||i);return i&&P(t,e,i),i};class h extends w.PktInputElement{constructor(){super(),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=q.props.displayValueAs.default,this.tagPlacement=null,this.isOpen=!1,this._options=[],this._value=[],this._isOptionsOpen=!1,this._userInfoMessage="",this._addValueText=null,this._maxIsReached=!1,this._search="",this._inputFocus=!1,this._internalValueSync=!1,this._optionsFromSlot=!1,this._lastSlotGeneration=0,this._suppressNextOpen=!1,this.inputRef=b.e(),this.triggerRef=b.e(),this.listboxRef=b.e(),this.optionsController=new C.PktOptionsSlotController(this)}get _hasTextInput(){return this.typeahead||this.allowUserInput}get _selectionDescription(){if(!(!this.multiple||this._value.length===0))return`${this._value.length} valgt`}focusTrigger(){var t,e;this._hasTextInput?(t=this.inputRef.value)==null||t.focus():(e=this.triggerRef.value)==null||e.focus()}parseValue(){return Array.isArray(this.value)?this.multiple?this.value:this.value.length>0?[this.value[0]]:[]:this.value&&this.multiple?this.value.split(","):this.value?[this.value]:[]}updateMaxReached(){this._maxIsReached=u.isMaxSelectionReached(this._value.length,this.maxlength)}syncValueAndDispatch(t){const e=this._value,s=this.multiple?e.join(","):e[0]||"",i=Array.isArray(this.value)?this.value.join(","):String(this.value||"");if(s!==i&&(this._internalValueSync=!0,this.value=s),(t==null?void 0:t.join(","))!==e.join(",")){const l=this.multiple?[...e]:e[0]||"";this.onChange(l)}else e.length===0&&t&&t.length>0&&this.clearInputValue()}onChange(t){this.touched=!0,super.onChange(t)}valueChanged(){}}r([o.n({type:String,reflect:!0})],h.prototype,"value");r([o.n({type:Array})],h.prototype,"options");r([o.n({type:Array,attribute:"default-options"})],h.prototype,"defaultOptions");r([o.n({type:Boolean,attribute:"allow-user-input"})],h.prototype,"allowUserInput");r([o.n({type:Boolean})],h.prototype,"typeahead");r([o.n({type:Boolean,attribute:"include-search"})],h.prototype,"includeSearch");r([o.n({type:String,attribute:"search-placeholder"})],h.prototype,"searchPlaceholder");r([o.n({type:Boolean})],h.prototype,"multiple");r([o.n({type:Number})],h.prototype,"maxlength");r([o.n({type:String,attribute:"display-value-as"})],h.prototype,"displayValueAs");r([o.n({type:String,attribute:"tag-placement"})],h.prototype,"tagPlacement");r([o.n({type:Boolean,attribute:"open"})],h.prototype,"isOpen");r([v.r()],h.prototype,"_options");r([v.r()],h.prototype,"_value");r([v.r()],h.prototype,"_isOptionsOpen");r([v.r()],h.prototype,"_userInfoMessage");r([v.r()],h.prototype,"_addValueText");r([v.r()],h.prototype,"_maxIsReached");r([v.r()],h.prototype,"_search");r([v.r()],h.prototype,"_inputFocus");class B extends h{toggleValue(t){var $,I;if(this.disabled)return;this.touched=!0,this._userInfoMessage="",this._addValueText=null;const e=(($=u.findOptionByValue(this.options,t))==null?void 0:$.value)||null,s=this._value.includes(t||e||""),i=!!e,l=((I=this._options.find(T=>T.value===t))==null?void 0:I.disabled)||!1,n=!(t!=null&&t.trim()),p=!this.multiple,f=this.multiple,_=u.isMaxSelectionReached(this._value.length,this.maxlength);let c=!1,x=!0,g="",y="";l||(!i&&this.allowUserInput&&!n?(this.addNewUserValue(t),g="Ny verdi lagt til",c=f):!i&&!this.allowUserInput?(p&&this._value[0]&&this.removeValue(this._value[0]),x=!1,c=!0,g="Ingen treff i søket"):s?(this.removeValue(e),c=!0,p&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value="")):n&&p?(this.removeAllSelected(),c=!0):p?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(e),c=!1):f&&!_?(this.setSelected(e),c=!0):f&&_?(g="Maks antall valg nådd",x=!1,y=t):(p&&this.removeAllSelected(),g="Ingen gyldig verdi valgt",x=!1,c=!0,y=t),this._isOptionsOpen=c,c||(p&&this._hasTextInput&&(this._suppressNextOpen=!0),window.setTimeout(()=>{this.focusTrigger()},0)),this._userInfoMessage=g,this._search=y||"",this.resetComboboxInput(x),f&&this.updateMaxReached())}setSelected(t){if(!this._value.includes(t)){if(this.multiple&&u.isMaxSelectionReached(this._value.length,this.maxlength)){this._userInfoMessage="Maks antall valg nådd";return}!this.multiple&&this.removeAllSelected(),this._value=t?[...this._value,t]:this._value,m.markOptionSelected(this._options,t),this.resetComboboxInput(!0)}}removeSelected(t){if(!t)return;this._value=this._value.filter(s=>s!==t);const e=u.findOptionByValue(this.options,t);e&&(m.markOptionDeselected(this.options,t),e.userAdded?(this._options=[...this._options.filter(s=>s.value!==t)],this.options=[...this.options.filter(s=>s.value!==t)]):this._options.some(s=>s.value===t)||(this._options=[...this._options,e]))}addAllOptions(){if(this.multiple){if(this.maxlength&&this._options.length>this.maxlength){this._userInfoMessage="For mange valgt";return}this._value=this._options.map(t=>t.value),m.markAllSelected(this._options),this.requestUpdate()}}removeAllSelected(){this._value=[],m.markAllDeselected(this._options),this._options=m.removeUserAddedOptions(this._options),this.requestUpdate()}addValue(){var e;const t=((e=this.inputRef.value)==null?void 0:e.value.trim())||"";if(this._search=t,t&&this._value.includes(t)){this.resetComboboxInput(!0),this._userInfoMessage="Verdien er allerede valgt";return}this.toggleValue(t)}removeValue(t){this._value=this.multiple?this._value.filter(e=>e!==t):[],this.removeSelected(t)}addNewUserValue(t){if(!t||t.trim()==="")return;if(!this.multiple)this._value[0]&&this.removeSelected(this._value[0]),this._value=[t];else if(!u.findOptionByValue(this.options,t)){if(u.isMaxSelectionReached(this._value.length,this.maxlength))return;this._value=[...this._value,t]}const e={value:t,label:t,userAdded:!0,selected:!0};this.options=[e,...this.options],this._options=[e,...this._options],this.resetComboboxInput(!0),this.multiple||(this._isOptionsOpen=!1,this._hasTextInput&&(this._suppressNextOpen=!0),window.setTimeout(()=>{this.focusTrigger()},0)),this.requestUpdate()}resetComboboxInput(t=!0){this._addValueText=null,this.inputRef.value&&this.inputRef.value.type!=="hidden"&&t&&(this._search="",this.multiple?this.inputRef.value.value="":(this.inputRef.value.value=this._value[0]?O(this._value[0],this.options,this.displayValueAs):"",this._userInfoMessage="")),this._options=[...this.options]}removeLastValue(t){if(this._value.length===0)return;t.preventDefault();const e=this._value[this._value.length-1];e&&this.removeSelected(e),this.updateMaxReached()}}class E extends B{handleInput(t){if(t.stopPropagation(),t.stopImmediatePropagation(),this.disabled)return;this.touched=!0;const e=t.target;if(this._search=e.value,this.checkForMatches(),this.typeahead)if(this._search){const{filtered:s,suggestion:i}=u.findTypeaheadMatches(this.options,this._search);this._options=s,t.inputType!=="deleteContentBackward"&&(i!=null&&i.label)&&this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(e.value=i.label,window.setTimeout(()=>e.setSelectionRange(this._search.length,e.value.length),0),e.selectionDirection="backward")}else this._options=[...this.options]}handleFocus(){if(!this.disabled){if(this._suppressNextOpen){this._suppressNextOpen=!1,this._inputFocus=!0,this.requestUpdate();return}!this.multiple&&this._value[0]&&this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value=O(this._value[0],this.options,this.displayValueAs)),this._inputFocus=!0,this._search="",this._options=[...this.options],this._isOptionsOpen=!0,this.onFocus(),this.requestUpdate()}}handleFocusOut(t){var i,l;if(this.disabled||!this._isOptionsOpen)return;const e=t.relatedTarget;((i=e==null?void 0:e.closest("pkt-combobox"))==null?void 0:i.id)===this.id||((l=t.target)==null?void 0:l.getAttribute("data-focusfix"))===this.id||e===this.inputRef.value||e===this.triggerRef.value||this.closeAndProcessInput()}closeAndProcessInput(){if(this._inputFocus=!1,this._addValueText=null,this._userInfoMessage="",this._search="",this.inputRef.value&&this.inputRef.value.type!=="hidden"){const t=this.inputRef.value.value;if(this.multiple){if(t!==""){const{action:e,value:s}=M(t,this._value,this.options,this.allowUserInput,this.multiple);switch(e){case"addUserValue":this.addNewUserValue(s);break;case"selectOption":this.setSelected(s);break;case"removeValue":this.removeValue(s);break}}}else if(!t)this._value[0]&&this.removeSelected(this._value[0]);else{const e=u.findOptionByValue(this.options,t);e&&e.value!==this._value[0]?(this._value[0]&&this.removeSelected(this._value[0]),this.setSelected(e.value)):!e&&this.allowUserInput&&(this._value[0]&&this.removeSelected(this._value[0]),this.addNewUserValue(t))}!this.multiple&&this._value[0]?this.inputRef.value.value=O(this._value[0],this.options,this.displayValueAs):this.inputRef.value.value=""}this._isOptionsOpen=!1,this.onBlur()}handleBlur(){this._inputFocus=!1,this.onBlur()}handleInputClick(t){var e,s;if(this.disabled){t.preventDefault(),t.stopImmediatePropagation();return}this._hasTextInput?((e=this.inputRef.value)==null||e.focus(),this.requestUpdate()):(t.stopImmediatePropagation(),t.preventDefault(),this._isOptionsOpen=!this._isOptionsOpen,this._isOptionsOpen&&((s=this.listboxRef.value)==null||s.focusFirstOrSelectedOption()))}handlePlaceholderClick(t){this.disabled||(t.stopPropagation(),this._hasTextInput&&this.inputRef.value?(this.inputRef.value.focus(),this._inputFocus=!0,this.requestUpdate()):(this._isOptionsOpen=!this._isOptionsOpen,this.requestUpdate()))}handleSelectOnlyKeydown(t){var e,s;if(!this.disabled)switch(t.key){case"Enter":case" ":case"ArrowDown":case"ArrowUp":t.preventDefault(),this._isOptionsOpen?this._isOptionsOpen=!1:(this._isOptionsOpen=!0,(e=this.listboxRef.value)==null||e.focusFirstOrSelectedOption());break;case"Escape":this._isOptionsOpen&&(t.preventDefault(),this._isOptionsOpen=!1);break;case"Home":case"End":t.preventDefault(),this._isOptionsOpen||(this._isOptionsOpen=!0),(s=this.listboxRef.value)==null||s.focusFirstOrSelectedOption();break;case"ArrowLeft":this.multiple&&this._value.length>0&&(t.preventDefault(),this.focusTag(this._value.length-1));break;case"Backspace":case"Delete":this.multiple&&this._value.length>0&&(t.preventDefault(),this.removeSelected(this._value[this._value.length-1]));break}}handleOptionToggled(t){this.toggleValue(t.detail)}handleSearch(t){t.stopPropagation(),this._search=t.detail.toLowerCase(),this.checkForMatches()}handleInputKeydown(t){var s,i,l;if(t.key==="Backspace"){const n=!((s=this.inputRef.value)!=null&&s.value);!this._search&&n&&this.multiple&&this._value.length>0&&this.removeLastValue(t);return}if(t.key==="ArrowLeft"&&this.multiple&&this._value.length>0){const n=this.inputRef.value;if(n&&n.selectionStart===0&&!n.value){t.preventDefault(),this.focusTag(this._value.length-1);return}}const e=F(t.key,t.shiftKey,this.multiple);if(e&&!(t.key==="Tab"&&!this._isOptionsOpen)){if(e==="focusListbox"&&t.key==="Tab"&&!((i=this.listboxRef.value)==null?void 0:i.querySelector('[role="option"]:not([data-disabled]), [data-type="new-option"]'))){this.closeAndProcessInput();return}switch(t.preventDefault(),e){case"addValue":this.addValue();break;case"focusListbox":(l=this.listboxRef.value)==null||l.focusFirstOrSelectedOption();break;case"closeOptions":this._isOptionsOpen=!1;break}}}handleTagRemove(t){this.removeSelected(t),this._hasTextInput&&this.inputRef.value&&(this._inputFocus=!0,this.inputRef.value.focus(),this.requestUpdate())}getInsideTags(){return Array.from(this.querySelectorAll(".pkt-combobox__input .pkt-combobox__tag-list pkt-tag"))}focusTag(t){var i;const e=this.getInsideTags();e.forEach((l,n)=>{l.buttonTabindex=n===t?0:-1});const s=(i=e[t])==null?void 0:i.querySelector("button");s==null||s.focus()}resetTagTabindices(){this.getInsideTags().forEach(e=>{e.buttonTabindex=-1})}handleTagKeydown(t,e){t.stopPropagation();const s=()=>{var i;this.resetTagTabindices(),this._hasTextInput&&this.inputRef.value?this.inputRef.value.focus():(i=this.triggerRef.value)==null||i.focus()};switch(t.key){case"ArrowLeft":t.preventDefault(),e>0&&this.focusTag(e-1);break;case"ArrowRight":t.preventDefault(),e<this._value.length-1?this.focusTag(e+1):s();break;case"Backspace":case"Delete":t.preventDefault();{const i=this._value[e],l=e>=this._value.length-1?e-1:e;this.removeSelected(i),l>=0?(this.requestUpdate(),this.updateComplete.then(()=>this.focusTag(l))):s()}break;case"Tab":this.resetTagTabindices();break;case"Escape":t.preventDefault(),s();break}}checkForMatches(){var s;const t=((s=this.inputRef.value)==null?void 0:s.value)||this._search||"",e=U(t,this._value,this.options,this.allowUserInput,this.multiple);if(e.shouldRemoveValue&&this.removeValue(this._value[0]),e.shouldResetInput){this.resetComboboxInput(!1);return}this._addValueText=e.addValueText,this._userInfoMessage=e.userInfoMessage}}var N=Object.getOwnPropertyDescriptor,L=(a,t,e,s)=>{for(var i=s>1?void 0:s?N(t,e):t,l=a.length-1,n;l>=0;l--)(n=a[l])&&(i=n(i)||i);return i};exports.PktCombobox=class extends E{constructor(){super(...arguments),this.handleBodyClick=t=>{this._isOptionsOpen&&!this.contains(t.target)&&this.closeAndProcessInput()}}connectedCallback(){var t,e;if(super.connectedCallback(),document==null||document.body.addEventListener("click",this.handleBodyClick),this._options=[],this.defaultOptions&&this.defaultOptions.length){const s=((t=this.options)==null?void 0:t.filter(i=>i.userAdded))||[];this.options=[...s,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=Array.isArray(this.options)?[...this.options]:[]}if((e=this.optionsController)!=null&&e.nodes&&this.optionsController.nodes.length){const s=A.parseOptionsFromSlot(this.optionsController.nodes);s.length&&(this.options=[...s],this._options=[...s],this._optionsFromSlot=!0,this._lastSlotGeneration=this.optionsController.generation)}}willUpdate(t){if(this._optionsFromSlot&&this.optionsController){const e=this.optionsController.generation;if(e!==this._lastSlotGeneration){this._lastSlotGeneration=e;const s=A.parseOptionsFromSlot(this.optionsController.nodes),i=this._options.filter(l=>l.userAdded);this.options=[...i,...s]}}super.willUpdate(t)}disconnectedCallback(){super.disconnectedCallback(),document==null||document.body.removeEventListener("click",this.handleBodyClick)}firstUpdated(t){this.defaultValue!==null&&!this.value&&(this.value=this.defaultValue),super.firstUpdated(t)}updated(t){t.has("isOpen")&&(this._isOptionsOpen=this.isOpen);const e=t.has("value"),s=t.has("_value");if(e&&this._internalValueSync)this._internalValueSync=!1,s&&this.syncValueAndDispatch(t.get("_value"));else if(e){const l=[...this._value],n=this.parseValue();n.join(",")!==this._value.join(",")&&(this._value=n),this.updateMaxReached(),this.syncValueAndDispatch(l)}else s&&this.syncValueAndDispatch(t.get("_value"));if(t.has("defaultOptions")&&this.defaultOptions.length){const l=(Array.isArray(this.options)?this.options:[]).filter(n=>n.userAdded)||[];this.options=[...l,...JSON.parse(JSON.stringify(this.defaultOptions))],this._options=Array.isArray(this.options)?[...this.options]:[]}if(t.has("options")){const l=t.get("options")||this._options||[],n=k.mergeWithUserAdded(this.options,l);this._options=n,n.length>this.options.length&&(this.options=n);const p=k.syncOptionsWithValues(this._options,this._value);if(this._options=p.options,p.newValues.length>this._value.length){const f=[...this._value];this._value=p.newValues,this.syncValueAndDispatch(f)}}if(t.has("_search")&&this.dispatchEvent(new CustomEvent("search",{detail:this._search,bubbles:!1})),!this._isOptionsOpen&&!this.multiple&&this._hasTextInput&&this.inputRef.value&&this.inputRef.value.type!=="hidden"){const l=this._value[0]?O(this._value[0],this.options,this.displayValueAs):"";this.inputRef.value.value!==l&&(this.inputRef.value.value=l)}super.updated(t)}formResetCallback(){this.touched=!1;const t=this.defaultValue||(this.multiple,"");this.value=t,this._value=this.parseValue(),this._options=this._options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this.options=this.options.filter(e=>!e.userAdded).map(e=>({...e,selected:this._value.includes(e.value)})),this._search="",this._isOptionsOpen=!1,this._userInfoMessage="",this._addValueText=null,this._inputFocus=!1,this.updateMaxReached(),this.inputRef.value&&this.inputRef.value.type!=="hidden"&&(this.inputRef.value.value=""),this.internals.setFormValue(""),this.internals.ariaInvalid="false",this.requestUpdate()}attributeChangedCallback(t,e,s){if(t==="options"){this._options=Array.isArray(this.options)?[...this.options]:[];const i=k.syncOptionsWithValues(this._options,this._value);this._options=i.options,i.newValues.length>this._value.length&&(this._value=i.newValues),this._search=""}super.attributeChangedCallback(t,e,s)}render(){return o.b`
+      <pkt-input-wrapper
+        .label=${this.label}
+        .helptext=${this.helptext}
+        .helptextDropdown=${d.o(this.helptextDropdown)}
+        .helptextDropdownButton=${d.o(this.helptextDropdownButton)}
+        ?fullwidth=${this.fullwidth}
+        ?hasError=${this.hasError}
+        ?inline=${this.inline}
+        ?disabled=${this.disabled}
+        .errorMessage=${this.errorMessage}
+        ?optionalTag=${this.optionalTag}
+        .optionalText=${this.optionalText}
+        ?requiredTag=${this.requiredTag}
+        .requiredText=${this.requiredText}
+        .tagText=${this.tagText}
+        useWrapper=${this.useWrapper}
+        .forId=${this._hasTextInput?this.id+"-input":this.id+"-combobox"}
+        ?hasFieldset=${!this._hasTextInput}
+        class="pkt-combobox__wrapper"
+        @labelClick=${this.handleInputClick}
+      >
+        <div class="pkt-contents" slot="helptext">${R.slotContent(this,"helptext")}</div>
+        <div class="pkt-combobox" @focusout=${this.handleFocusOut}>
+          <div
+            class=${V.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})}
+            id=${d.o(this._hasTextInput?void 0:`${this.id}-combobox`)}
+            role=${d.o(this._hasTextInput?void 0:"combobox")}
+            aria-expanded=${d.o(this._hasTextInput?void 0:this._isOptionsOpen?"true":"false")}
+            aria-controls=${d.o(this._hasTextInput?void 0:`${this.id}-listbox`)}
+            aria-haspopup=${d.o(this._hasTextInput?void 0:"listbox")}
+            aria-labelledby=${d.o(this._hasTextInput?void 0:`${this.id}-combobox-label`)}
+            aria-activedescendant=${d.o(!this._hasTextInput&&this._value[0]&&u.findOptionByValue(this.options,this._value[0])?`${this.id}-listbox-${u.findOptionIndex(this._options,this._value[0])}`:void 0)}
+            aria-description=${d.o(this._selectionDescription||void 0)}
+            tabindex=${this._hasTextInput||this.disabled?"-1":"0"}
+            @click=${this.handleInputClick}
+            @keydown=${this._hasTextInput?o.A:this.handleSelectOnlyKeydown}
+            ${b.n(this.triggerRef)}
+          >
+            ${!this._hasTextInput&&this.placeholder&&(!this._value.length||this.multiple&&this.tagPlacement=="outside")&&!this._inputFocus?o.b`<span class="pkt-combobox__placeholder" @click=${this.handlePlaceholderClick}
+                  >${this.placeholder}</span
+                >`:this.tagPlacement!=="outside"?this.renderSingleOrMultipleValues():o.A}
+            ${this.renderInputField()}
+            <pkt-icon
+              class=${V.e({"pkt-combobox__arrow-icon":!0,"pkt-combobox__arrow-icon--open":this._isOptionsOpen})}
+              name="chevron-thin-down"
+              aria-hidden="true"
+            ></pkt-icon>
+          </div>
+
+          <pkt-listbox
+            id="${this.id}-listbox"
+            .options=${this._options}
+            .isOpen=${this._isOptionsOpen}
+            .searchPlaceholder=${this.searchPlaceholder}
+            .label="Liste: ${this.label||""}"
+            ?include-search=${this.includeSearch}
+            ?is-multi-select=${this.multiple}
+            ?allow-user-input=${this.allowUserInput&&!this._maxIsReached}
+            ?max-is-reached=${this._maxIsReached}
+            .customUserInput=${d.o(this._addValueText)}
+            .userMessage=${this._userInfoMessage}
+            @search=${this.handleSearch}
+            @option-toggle=${this.handleOptionToggled}
+            @select-all=${this.addAllOptions}
+            @close-options=${()=>this._isOptionsOpen=!1}
+            @tab-close=${()=>this.closeAndProcessInput()}
+            .searchValue=${this._search||null}
+            .maxLength=${this.maxlength||0}
+            ${b.n(this.listboxRef)}
+          ></pkt-listbox>
+        </div>
+
+        ${this.tagPlacement==="outside"&&this.multiple?o.b`<div class="pkt-combobox__tags-outside">
+              ${this.renderSingleOrMultipleValues()}
+            </div>`:o.A}
+      </pkt-input-wrapper>
+    `}renderInputField(){return this.typeahead||this.allowUserInput?o.b`
+          <div class="pkt-combobox__input-div combobox__input">
+            <input
+              type="text"
+              id="${this.id}-input"
+              name=${(this.name||this.id)+"-input"}
+              placeholder=${d.o(!this._value.length||this.multiple&&this.tagPlacement==="outside"?this.placeholder:void 0)}
+              @input=${this.handleInput}
+              @change=${t=>{t.stopPropagation(),t.stopImmediatePropagation()}}
+              @keydown=${this.handleInputKeydown}
+              @focus=${this.handleFocus}
+              @blur=${this.handleBlur}
+              autocomplete="off"
+              role="combobox"
+              aria-expanded=${this._isOptionsOpen?"true":"false"}
+              aria-label=${d.o(this.label)}
+              aria-autocomplete=${this.typeahead?"both":this.allowUserInput?"list":"none"}
+              aria-controls="${this.id}-listbox"
+              aria-activedescendant=${d.o(this._value[0]&&u.findOptionByValue(this.options,this._value[0])?`${this.id}-listbox-${u.findOptionIndex(this._options,this._value[0])}`:void 0)}
+              aria-description=${d.o(this._selectionDescription||void 0)}
+              ${b.n(this.inputRef)}
+            />
+          </div>
+        `:o.b`
+          <input
+            type="hidden"
+            id="${this.id}-input"
+            name=${(this.name||this.id)+"-input"}
+            .value=${this._value.join(",")}
+            ${b.n(this.inputRef)}
+          />
+        `}renderSingleOrMultipleValues(){if(!this.multiple&&this._hasTextInput)return o.A;const t=!this.multiple,e=this.renderValueTag(u.findOptionByValue(this.options,this._value[0])),s=this.tagPlacement==="outside",i=o.b`
+      <ul role="list" class="pkt-combobox__tag-list">
+        ${S.c(this._value,l=>l,(l,n)=>{const p=u.findOptionByValue(this.options,l),f=p==null?void 0:p.tagSkinColor;return o.b`
+              <li
+                role="listitem"
+                @click=${s?o.A:_=>_.stopPropagation()}
+                @mousedown=${s?o.A:_=>_.preventDefault()}
+              >
+                <pkt-tag
+                  skin=${f||"blue-dark"}
+                  ?closeTag=${!this.disabled}
+                  .buttonTabindex=${s?void 0:-1}
+                  @close=${()=>this.handleTagRemove(l)}
+                  @keydown=${s?o.A:_=>this.handleTagKeydown(_,n)}
+                >
+                  ${this.renderValueTag(p)}
+                </pkt-tag>
+              </li>
+            `})}
+      </ul>
+    `;return t?e:i}renderValueTag(t){if(!t)return"";switch(this.displayValueAs){case"prefixAndValue":return o.b`<span class="pkt-combobox__value" data-focusfix=${this.id}
+          >${t.prefix||""} ${t.value}</span
+        >`;case"value":return o.b`<span class="pkt-combobox__value" data-focusfix=${this.id}
+          >${t.value}</span
+        >`;case"label":default:return o.b`<span class="pkt-combobox__value" data-focusfix=${this.id}
+          >${t.label||t.value}</span
+        >`}}};exports.PktCombobox=L([o.t("pkt-combobox")],exports.PktCombobox);