@designsystem-se/af 32.1.1 → 32.2.0

package/dist/cjs/{index-cfa8e9be.js → index-4c078883.js}

@@ -21,7 +21,7 @@ function _interopNamespace(e) {
 }
 
 const NAMESPACE = 'digi-arbetsformedlingen';
-const BUILD = /* digi-arbetsformedlingen */ { allRenderFn: false, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: true, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: false, scoped: true, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* digi-arbetsformedlingen */ { allRenderFn: false, appendChildSlotFix: true, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: true, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: true, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: true, experimentalSlotFixes: true, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: false, scoped: true, scopedSlotTextContentFix: true, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: true, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 /*
  Stencil Client Platform v4.23.0 | MIT Licensed | https://stenciljs.com
@@ -1111,6 +1111,8 @@ var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
 var XLINK_NS = "http://www.w3.org/1999/xlink";
 var win = typeof window !== "undefined" ? window : {};
 var doc = win.document || { head: {} };
+var H = win.HTMLElement || class {
+};
 var plt = {
   $flags$: 0,
   $resourcesUrl$: "",
@@ -1120,6 +1122,7 @@ var plt = {
   rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
   ce: (eventName, opts) => new CustomEvent(eventName, opts)
 };
+var supportsShadow = BUILD.shadowDom;
 var supportsListenerOptions = /* @__PURE__ */ (() => {
   let supportsListenerOptions2 = false;
   try {
@@ -1577,13 +1580,33 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
       oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
       if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
         {
-          putBackInOriginalLocation(oldParentVNode.$elm$, false);
+          relocateToHostRoot(oldParentVNode.$elm$);
         }
       }
     }
   }
   return elm;
 };
+var relocateToHostRoot = (parentElm) => {
+  plt.$flags$ |= 1 /* isTmpDisconnected */;
+  const host = parentElm.closest(hostTagName.toLowerCase());
+  if (host != null) {
+    const contentRefNode = Array.from(host.__childNodes || host.childNodes).find(
+      (ref) => ref["s-cr"]
+    );
+    const childNodeArray = Array.from(
+      parentElm.__childNodes || parentElm.childNodes
+    );
+    for (const childNode of contentRefNode ? childNodeArray.reverse() : childNodeArray) {
+      if (childNode["s-sh"] != null) {
+        insertBefore(host, childNode, contentRefNode != null ? contentRefNode : null);
+        childNode["s-sh"] = void 0;
+        checkSlotRelocate = true;
+      }
+    }
+  }
+  plt.$flags$ &= ~1 /* isTmpDisconnected */;
+};
 var putBackInOriginalLocation = (parentElm, recursive) => {
   plt.$flags$ |= 1 /* isTmpDisconnected */;
   const oldSlotChildNodes = Array.from(parentElm.__childNodes || parentElm.childNodes);
@@ -1773,7 +1796,12 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
       isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
     }
     {
-      if (tag === "slot" && !useNativeShadowDom) ; else {
+      if (tag === "slot" && !useNativeShadowDom) {
+        if (oldVNode.$name$ !== newVNode2.$name$) {
+          newVNode2.$elm$["s-sn"] = newVNode2.$name$ || "";
+          relocateToHostRoot(newVNode2.$elm$.parentElement);
+        }
+      } else {
         updateElement(oldVNode, newVNode2, isSvgMode);
       }
     }
@@ -1838,7 +1866,7 @@ var markSlotContentForRelocation = (elm) => {
       const slotName = childNode["s-sn"];
       for (j = hostContentNodes.length - 1; j >= 0; j--) {
         node = hostContentNodes[j];
-        if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!BUILD.experimentalSlotFixes  )) {
+        if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!node["s-sh"] || node["s-sh"] !== childNode["s-hn"])) {
           if (isNodeLocatedInSlot(node, slotName)) {
             let relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
             checkSlotFallbackVisibility = true;
@@ -1931,7 +1959,7 @@ var updateElementScopeIds = (element, parent, iterateChildNodes = false) => {
   }
 };
 var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const hostElm = hostRef.$hostElement$;
   const cmpMeta = hostRef.$cmpMeta$;
   const oldVNode = hostRef.$vnode$ || newVNode(null, null);
@@ -1975,7 +2003,7 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
         if (slotRefNode) {
           const parentNodeRef = slotRefNode.parentNode;
           let insertBeforeNode = slotRefNode.nextSibling;
-          {
+          if (insertBeforeNode && insertBeforeNode.nodeType === 1 /* ElementNode */) {
             let orgLocationNode = (_a = nodeToRelocate["s-ol"]) == null ? void 0 : _a.previousSibling;
             while (orgLocationNode) {
               let refNode = (_b = orgLocationNode["s-nr"]) != null ? _b : null;
@@ -1994,9 +2022,6 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
           }
           if (!insertBeforeNode && parentNodeRef !== nodeToRelocate.parentNode || nodeToRelocate.nextSibling !== insertBeforeNode) {
             if (nodeToRelocate !== insertBeforeNode) {
-              if (!nodeToRelocate["s-hn"] && nodeToRelocate["s-ol"]) {
-                nodeToRelocate["s-hn"] = nodeToRelocate["s-ol"].parentNode.nodeName;
-              }
               insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode);
               if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
                 nodeToRelocate.hidden = (_c = nodeToRelocate["s-ih"]) != null ? _c : false;
@@ -2020,8 +2045,247 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
     plt.$flags$ &= ~1 /* isTmpDisconnected */;
     relocateNodes.length = 0;
   }
+  if (cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
+    const children = rootVnode.$elm$.__childNodes || rootVnode.$elm$.childNodes;
+    for (const childNode of children) {
+      if (childNode["s-hn"] !== hostTagName && !childNode["s-sh"]) {
+        if (isInitialLoad && childNode["s-ih"] == null) {
+          childNode["s-ih"] = (_e = childNode.hidden) != null ? _e : false;
+        }
+        childNode.hidden = true;
+      }
+    }
+  }
   contentRef = void 0;
 };
+
+// src/runtime/dom-extras.ts
+var patchPseudoShadowDom = (hostElementPrototype) => {
+  patchCloneNode(hostElementPrototype);
+  patchSlotAppendChild(hostElementPrototype);
+  patchSlotAppend(hostElementPrototype);
+  patchSlotPrepend(hostElementPrototype);
+  patchSlotInsertAdjacentElement(hostElementPrototype);
+  patchSlotInsertAdjacentHTML(hostElementPrototype);
+  patchSlotInsertAdjacentText(hostElementPrototype);
+  patchTextContent(hostElementPrototype);
+  patchChildSlotNodes(hostElementPrototype);
+  patchSlotRemoveChild(hostElementPrototype);
+};
+var patchCloneNode = (HostElementPrototype) => {
+  const orgCloneNode = HostElementPrototype.cloneNode;
+  HostElementPrototype.cloneNode = function(deep) {
+    const srcNode = this;
+    const isShadowDom = srcNode.shadowRoot && supportsShadow ;
+    const clonedNode = orgCloneNode.call(srcNode, isShadowDom ? deep : false);
+    if (!isShadowDom && deep) {
+      let i2 = 0;
+      let slotted, nonStencilNode;
+      const stencilPrivates = [
+        "s-id",
+        "s-cr",
+        "s-lr",
+        "s-rc",
+        "s-sc",
+        "s-p",
+        "s-cn",
+        "s-sr",
+        "s-sn",
+        "s-hn",
+        "s-ol",
+        "s-nr",
+        "s-si",
+        "s-rf",
+        "s-scs"
+      ];
+      const childNodes = this.__childNodes || this.childNodes;
+      for (; i2 < childNodes.length; i2++) {
+        slotted = childNodes[i2]["s-nr"];
+        nonStencilNode = stencilPrivates.every((privateField) => !childNodes[i2][privateField]);
+        if (slotted) {
+          if (clonedNode.__appendChild) {
+            clonedNode.__appendChild(slotted.cloneNode(true));
+          } else {
+            clonedNode.appendChild(slotted.cloneNode(true));
+          }
+        }
+        if (nonStencilNode) {
+          clonedNode.appendChild(childNodes[i2].cloneNode(true));
+        }
+      }
+    }
+    return clonedNode;
+  };
+};
+var patchSlotAppendChild = (HostElementPrototype) => {
+  HostElementPrototype.__appendChild = HostElementPrototype.appendChild;
+  HostElementPrototype.appendChild = function(newChild) {
+    const slotName = newChild["s-sn"] = getSlotName(newChild);
+    const slotNode = getHostSlotNode(this.__childNodes || this.childNodes, slotName, this.tagName);
+    if (slotNode) {
+      addSlotRelocateNode(newChild, slotNode);
+      const slotChildNodes = getHostSlotChildNodes(slotNode, slotName);
+      const appendAfter = slotChildNodes[slotChildNodes.length - 1];
+      const insertedNode = insertBefore(appendAfter.parentNode, newChild, appendAfter.nextSibling);
+      updateFallbackSlotVisibility(this);
+      return insertedNode;
+    }
+    return this.__appendChild(newChild);
+  };
+};
+var patchSlotRemoveChild = (ElementPrototype) => {
+  ElementPrototype.__removeChild = ElementPrototype.removeChild;
+  ElementPrototype.removeChild = function(toRemove) {
+    if (toRemove && typeof toRemove["s-sn"] !== "undefined") {
+      const childNodes = this.__childNodes || this.childNodes;
+      const slotNode = getHostSlotNode(childNodes, toRemove["s-sn"], this.tagName);
+      if (slotNode && toRemove.isConnected) {
+        toRemove.remove();
+        updateFallbackSlotVisibility(this);
+        return;
+      }
+    }
+    return this.__removeChild(toRemove);
+  };
+};
+var patchSlotPrepend = (HostElementPrototype) => {
+  HostElementPrototype.__prepend = HostElementPrototype.prepend;
+  HostElementPrototype.prepend = function(...newChildren) {
+    newChildren.forEach((newChild) => {
+      if (typeof newChild === "string") {
+        newChild = this.ownerDocument.createTextNode(newChild);
+      }
+      const slotName = newChild["s-sn"] = getSlotName(newChild);
+      const childNodes = this.__childNodes || this.childNodes;
+      const slotNode = getHostSlotNode(childNodes, slotName, this.tagName);
+      if (slotNode) {
+        addSlotRelocateNode(newChild, slotNode, true);
+        const slotChildNodes = getHostSlotChildNodes(slotNode, slotName);
+        const appendAfter = slotChildNodes[0];
+        return insertBefore(appendAfter.parentNode, newChild, appendAfter.nextSibling);
+      }
+      if (newChild.nodeType === 1 && !!newChild.getAttribute("slot")) {
+        newChild.hidden = true;
+      }
+      return HostElementPrototype.__prepend(newChild);
+    });
+  };
+};
+var patchSlotAppend = (HostElementPrototype) => {
+  HostElementPrototype.__append = HostElementPrototype.append;
+  HostElementPrototype.append = function(...newChildren) {
+    newChildren.forEach((newChild) => {
+      if (typeof newChild === "string") {
+        newChild = this.ownerDocument.createTextNode(newChild);
+      }
+      this.appendChild(newChild);
+    });
+  };
+};
+var patchSlotInsertAdjacentHTML = (HostElementPrototype) => {
+  const originalInsertAdjacentHtml = HostElementPrototype.insertAdjacentHTML;
+  HostElementPrototype.insertAdjacentHTML = function(position, text) {
+    if (position !== "afterbegin" && position !== "beforeend") {
+      return originalInsertAdjacentHtml.call(this, position, text);
+    }
+    const container = this.ownerDocument.createElement("_");
+    let node;
+    container.innerHTML = text;
+    if (position === "afterbegin") {
+      while (node = container.firstChild) {
+        this.prepend(node);
+      }
+    } else if (position === "beforeend") {
+      while (node = container.firstChild) {
+        this.append(node);
+      }
+    }
+  };
+};
+var patchSlotInsertAdjacentText = (HostElementPrototype) => {
+  HostElementPrototype.insertAdjacentText = function(position, text) {
+    this.insertAdjacentHTML(position, text);
+  };
+};
+var patchSlotInsertAdjacentElement = (HostElementPrototype) => {
+  const originalInsertAdjacentElement = HostElementPrototype.insertAdjacentElement;
+  HostElementPrototype.insertAdjacentElement = function(position, element) {
+    if (position !== "afterbegin" && position !== "beforeend") {
+      return originalInsertAdjacentElement.call(this, position, element);
+    }
+    if (position === "afterbegin") {
+      this.prepend(element);
+      return element;
+    } else if (position === "beforeend") {
+      this.append(element);
+      return element;
+    }
+    return element;
+  };
+};
+var patchTextContent = (hostElementPrototype) => {
+  let descriptor = globalThis.Node && Object.getOwnPropertyDescriptor(Node.prototype, "textContent");
+  if (!descriptor) {
+    descriptor = Object.getOwnPropertyDescriptor(hostElementPrototype, "textContent");
+  }
+  if (descriptor) Object.defineProperty(hostElementPrototype, "__textContent", descriptor);
+  Object.defineProperty(hostElementPrototype, "textContent", {
+    get: function() {
+      let text = "";
+      const childNodes = this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes);
+      childNodes.forEach((node) => text += node.textContent || "");
+      return text;
+    },
+    set: function(value) {
+      const childNodes = this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes);
+      childNodes.forEach((node) => {
+        if (node["s-ol"]) node["s-ol"].remove();
+        node.remove();
+      });
+      this.insertAdjacentHTML("beforeend", value);
+    }
+  });
+};
+var patchChildSlotNodes = (elm) => {
+  class FakeNodeList extends Array {
+    item(n) {
+      return this[n];
+    }
+  }
+  let childNodesFn = globalThis.Node && Object.getOwnPropertyDescriptor(Node.prototype, "childNodes");
+  if (!childNodesFn) {
+    childNodesFn = Object.getOwnPropertyDescriptor(elm, "childNodes");
+  }
+  if (childNodesFn) Object.defineProperty(elm, "__childNodes", childNodesFn);
+  let childrenFn = Object.getOwnPropertyDescriptor(Element.prototype, "children");
+  if (!childrenFn) {
+    childrenFn = Object.getOwnPropertyDescriptor(elm, "children");
+  }
+  if (childrenFn) Object.defineProperty(elm, "__children", childrenFn);
+  Object.defineProperty(elm, "children", {
+    get() {
+      return this.childNodes.filter((n) => n.nodeType === 1);
+    }
+  });
+  Object.defineProperty(elm, "childElementCount", {
+    get() {
+      return this.children.length;
+    }
+  });
+  if (!childNodesFn) return;
+  Object.defineProperty(elm, "childNodes", {
+    get() {
+      var _a, _b;
+      if (!plt.$flags$ || !((_a = getHostRef(this)) == null ? void 0 : _a.$flags$) || (plt.$flags$ & 1 /* isTmpDisconnected */) === 0 && ((_b = getHostRef(this)) == null ? void 0 : _b.$flags$) & 2 /* hasRendered */) {
+        const result = new FakeNodeList();
+        const nodes = getSlottedChildNodes(this.__childNodes);
+        result.push(...nodes);
+        return result;
+      }
+      return FakeNodeList.from(this.__childNodes);
+    }
+  });
+};
 var addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
   let slottedNodeLocation;
   if (newChild["s-ol"] && newChild["s-ol"].isConnected) {
@@ -2054,6 +2318,39 @@ var addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
   newChild["s-ol"] = slottedNodeLocation;
   newChild["s-sh"] = slotNode["s-hn"];
 };
+var getSlottedChildNodes = (childNodes) => {
+  const result = [];
+  for (let i2 = 0; i2 < childNodes.length; i2++) {
+    const slottedNode = childNodes[i2]["s-nr"];
+    if (slottedNode && slottedNode.isConnected) {
+      result.push(slottedNode);
+    }
+  }
+  return result;
+};
+var getSlotName = (node) => node["s-sn"] || node.nodeType === 1 && node.getAttribute("slot") || "";
+var getHostSlotNode = (childNodes, slotName, hostName) => {
+  let i2 = 0;
+  let childNode;
+  for (; i2 < childNodes.length; i2++) {
+    childNode = childNodes[i2];
+    if (childNode["s-sr"] && childNode["s-sn"] === slotName && childNode["s-hn"] === hostName) {
+      return childNode;
+    }
+    childNode = getHostSlotNode(childNode.childNodes, slotName, hostName);
+    if (childNode) {
+      return childNode;
+    }
+  }
+  return null;
+};
+var getHostSlotChildNodes = (n, slotName) => {
+  const childNodes = [n];
+  while ((n = n.nextSibling) && n["s-sn"] === slotName) {
+    childNodes.push(n);
+  }
+  return childNodes;
+};
 var createTime = (fnName, tagName = "") => {
   {
     return () => {
@@ -3122,6 +3419,11 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
           return getHostRef(this).$onReadyPromise$;
         }
       };
+      {
+        if (cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
+          patchPseudoShadowDom(HostElement.prototype);
+        }
+      }
       cmpMeta.$lazyBundleId$ = lazyBundle[0];
       if (!exclude.includes(tagName) && !customElements2.get(tagName)) {
         cmpTags.push(tagName);
@@ -3200,6 +3502,7 @@ var hostListenerOpts = (flags) => supportsListenerOptions ? {
 var setNonce = (nonce) => plt.$nonce$ = nonce;
 
 exports.Fragment = Fragment;
+exports.H = H;
 exports.Host = Host;
 exports.bootstrapLazy = bootstrapLazy;
 exports.createEvent = createEvent;

package/dist/cjs/loader.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-cfa8e9be.js');
+const index = require('./index-4c078883.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 const defineCustomElements = async (win, options) => {

package/dist/collection/components/_calendar/calendar/calendar.css

@@ -368,12 +368,15 @@ License: none (public domain)
   justify-content: center;
   margin: 0 auto;
 }
-:host .digi-calendar__header--year-select :first-child {
+:host .digi-calendar__header--year-select digi-form-select:first-child {
   margin-right: var(--digi--padding--smaller);
 }
-:host .digi-calendar__header--year-select :last-child {
+:host .digi-calendar__header--year-select digi-form-select:last-child {
   width: 5rem;
 }
+:host .digi-calendar__header--year-select digi-form-select select {
+  padding-inline-end: 2rem;
+}
 :host .digi-calendar__header--month-step {
   flex: auto;
   display: inherit;

package/dist/collection/components/_form/form-select-filter/form-select-filter.js

@@ -352,6 +352,7 @@ export class FormSelectFilter {
         if (close) {
             this.emitFilterClosedEvent();
         }
+        this.afOnResetFilters.emit();
     }
     selectItemHandler(item) {
         if (this.afMultipleItems) {
@@ -465,16 +466,16 @@ export class FormSelectFilter {
             } }, h("slot", { name: "empty-search-result" })))));
     }
     render() {
-        return (h("div", { key: 'a7d976f92b3018f92a06713b12c5832dda5225b6', class: Object.assign({ 'digi-form-select-filter': true }, this.cssModifiers), role: "application", id: `${this.afId}-identifier` }, h("digi-form-label", { key: '61e92e590efb70e7480b48d3f7a0fcebc87592dc', afLabel: this.afFilterButtonTextLabel, afFor: `${this.afId}`, afId: `${this.afId}-label`, class: "digi-form-select-filter__label", afDescription: this.afDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), h("digi-util-keydown-handler", { key: '4eaf64b41e2b81bb67a2d17c58c9122103bc1724', onAfOnEsc: () => this.escHandler() }, h("button", { key: 'c085191cb5a29417e0505e18e4109afd81e80a3e', type: "button", id: `${this.afId}`, class: "digi-form-select-filter__toggle-button", onClick: () => this.toggleDropdown(), ref: (el) => (this._toggleButton = el), "aria-haspopup": "true", "aria-label": this.ariaLabel, "aria-labelledby": this.afFilterButtonAriaDescribedby, "aria-controls": `${this.afId}-dropdown-menu`, "aria-expanded": this.isOpen }, h("div", { key: '11cf919990f6eddb74e2c092c511c71f94c1c7d5', class: Object.assign({ 'digi-form-filter__toggle-button-wrapper': true }, this.cssModifiersToggleButtonWrapper) }, h("digi-icon-check", { key: '0268487d5b43ec16695498a2396b319b11b59842', class: Object.assign({ 'digi-form-select-filter__toggle-button-indicator': true }, this.cssModifiersToggleButtonIndicator), slot: "icon" }), h("span", { key: '10f98e5b917579189583b5dce13b8af32e0bec83', class: "digi-form-select-filter__toggle-button-text" }, this.renderButtonLabel)), h("digi-icon-chevron-down", { key: '8ec6fe6cbaa27ca7b6f8d086d201f2592f9e251d', class: "digi-form-select-filter__toggle-icon" })), h("div", { key: 'ada5a333dea3ca964f69f4aeb3fcdb8f162c3de7', id: `${this.afId}-dropdown-menu`, class: {
+        return (h("div", { key: '131d9bcd798a19ab4da264d59e7b2b938af39e4d', class: Object.assign({ 'digi-form-select-filter': true }, this.cssModifiers), role: "application", id: `${this.afId}-identifier` }, h("digi-form-label", { key: '6ad325b665d8d23ffb8bc926cec923a4f43cec77', afLabel: this.afFilterButtonTextLabel, afFor: `${this.afId}`, afId: `${this.afId}-label`, class: "digi-form-select-filter__label", afDescription: this.afDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), h("digi-util-keydown-handler", { key: 'd90ec9e07871d99e964036346a13d3dcf8bb98f3', onAfOnEsc: () => this.escHandler() }, h("button", { key: '1d64f4c3a76bc2d81a10b60e82ee7f5724192051', type: "button", id: `${this.afId}`, class: "digi-form-select-filter__toggle-button", onClick: () => this.toggleDropdown(), ref: (el) => (this._toggleButton = el), "aria-haspopup": "true", "aria-label": this.ariaLabel, "aria-labelledby": this.afFilterButtonAriaDescribedby, "aria-controls": `${this.afId}-dropdown-menu`, "aria-expanded": this.isOpen }, h("div", { key: '4c82b8b3dfd9a6c66bcbd852498eeabcd4aa5ccb', class: Object.assign({ 'digi-form-filter__toggle-button-wrapper': true }, this.cssModifiersToggleButtonWrapper) }, h("digi-icon-check", { key: '8b8d3ed48f8f7cfdc374ebf9d62da00891d15e06', class: Object.assign({ 'digi-form-select-filter__toggle-button-indicator': true }, this.cssModifiersToggleButtonIndicator), slot: "icon" }), h("span", { key: 'e35d0ae711a81e43886707bffaed3b10ecffb25d', class: "digi-form-select-filter__toggle-button-text" }, this.renderButtonLabel)), h("digi-icon-chevron-down", { key: 'dfe447e717e5c99d400390aaaacad6160d188928', class: "digi-form-select-filter__toggle-icon" })), h("div", { key: 'cd68ced3b7f00548e23a3d37e54bccbc3f7ca700', id: `${this.afId}-dropdown-menu`, class: {
                 'digi-form-select-filter__dropdown': true,
                 'digi-form-select-filter__dropdown--right': this.afAlignRight,
                 'digi-form-select-filter__dropdown--hidden': !this.isOpen
-            } }, h("fieldset", { key: '443dda42925af42b18b3a0e6e0523c89db57f97d' }, h("div", { key: '9e02dd520860e875d8f1b071a5b7893a8209fe01', class: "digi-form-select-filter__header" }, h("legend", { key: '3ff6051f2b4be5d754d6a2ca6dcd1f6f386cbc22', class: "digi-form-select-filter__legend" }, this.afFilterButtonTextLabel), h("digi-form-input", { key: '8ba02f344bf4f3a468ec8a2a2aa4a4fa2d242641', afLabel: this.afName, afId: `${this.afId}-search`, afVariation: FormInputVariation.MEDIUM, afType: FormInputType.SEARCH, afValidation: FormInputValidation.NEUTRAL, onAfOnFocus: () => {
+            } }, h("fieldset", { key: '8cf2eedb7d23bcec85d761336f80c94665f8de8b' }, h("div", { key: '9e791ab8c6eea058919f01e6819d64c84a1958a5', class: "digi-form-select-filter__header" }, h("legend", { key: '8497b0c1517187628a3978697cf804fb4a647935', class: "digi-form-select-filter__legend" }, this.afFilterButtonTextLabel), h("digi-form-input", { key: '934ae7bc9be7b0d3a312dea866e21065246c1a84', afLabel: this.afName, afId: `${this.afId}-search`, afVariation: FormInputVariation.MEDIUM, afType: FormInputType.SEARCH, afValidation: FormInputValidation.NEUTRAL, onAfOnFocus: () => {
                 this.focusListItemIndex = 0;
                 99;
             }, onAfOnKeyup: (e) => {
                 this.inputSearchKeyboardHandler(e.detail);
-            }, onAfOnInput: (e) => this.inputSearchInputHandler(e.detail), afValue: this._searchQuery, class: "digi-form-select-filter__search-input", afAriaControls: `${this.afId}-select-filter-list`, afAutocomplete: "off", afAriaAutocomplete: "none" }), this.renderEmptyStateBox()), h("div", { key: 'b039b034c57d84a2ebe8cf8f289648bc2f2a4be7', class: "digi-form-select-filter__scroll" }, h("digi-util-keydown-handler", { key: '2c3b956835201967582558a430bf3bababda4ad0', onAfOnDown: (e) => this.downHandler(e), onAfOnRight: (e) => this.downHandler(e), onAfOnUp: (e) => this.upHandler(e), onAfOnLeft: (e) => this.upHandler(e), onAfOnHome: (e) => this.homeHandler(e), onAfOnEnd: (e) => this.endHandler(e), onAfOnEnter: (e) => this.enterHandler(e), onAfOnSpace: (e) => this.spaceHandler(e), onAfOnTab: () => this.tabHandler(), onAfOnShiftTab: () => this.shiftHandler() }, h("ul", { key: '614956e483ad0530497a9f52fd54a664a8eee359', class: "digi-form-select-filter__list", "aria-labelledby": `${this.afId}`, id: `${this.afId}-select-filter-list`, role: this.afMultipleItems ? '' : 'radiogroup', "aria-invalid": this.afMultipleItems
+            }, onAfOnInput: (e) => this.inputSearchInputHandler(e.detail), afValue: this._searchQuery, class: "digi-form-select-filter__search-input", afAriaControls: `${this.afId}-select-filter-list`, afAutocomplete: "off", afAriaAutocomplete: "none" }), this.renderEmptyStateBox()), h("div", { key: '1768a9ad717b385f8a3c2c76d12c126009d97821', class: "digi-form-select-filter__scroll" }, h("digi-util-keydown-handler", { key: '55527df2cae38577b555155a03f50b1167eb8c65', onAfOnDown: (e) => this.downHandler(e), onAfOnRight: (e) => this.downHandler(e), onAfOnUp: (e) => this.upHandler(e), onAfOnLeft: (e) => this.upHandler(e), onAfOnHome: (e) => this.homeHandler(e), onAfOnEnd: (e) => this.endHandler(e), onAfOnEnter: (e) => this.enterHandler(e), onAfOnSpace: (e) => this.spaceHandler(e), onAfOnTab: () => this.tabHandler(), onAfOnShiftTab: () => this.shiftHandler() }, h("ul", { key: '7898741e2835ef7362a240feacd421aa843aedbb', class: "digi-form-select-filter__list", "aria-labelledby": `${this.afId}`, id: `${this.afId}-select-filter-list`, role: this.afMultipleItems ? '' : 'radiogroup', "aria-invalid": this.afMultipleItems
                 ? 'false'
                 : this.afValidation === FormSelectFilterValidation.ERROR
                     ? 'true'
@@ -482,11 +483,11 @@ export class FormSelectFilter {
                 ? false
                 : this.afRequired
                     ? 'true'
-                    : 'false' }, this.showNeutralValue && (h("li", { key: '465b17651311ae401dd6c52c6a418f09eacd3e12', class: "digi-form-select-filter__item", role: "radio", "aria-required": this.afMultipleItems
+                    : 'false' }, this.showNeutralValue && (h("li", { key: '5cc7d76c73e0029bd050417798bfc9b023132ee5', class: "digi-form-select-filter__item", role: "radio", "aria-required": this.afMultipleItems
                 ? 'false'
                 : this.afRequired
                     ? 'true'
-                    : 'false', "aria-checked": this._selectedItems.length === 0 ? 'true' : 'false', onClick: () => this.resetSelectItems(true), tabIndex: 0, "aria-label": this.afFilterButtonText }, this._selectedItems.length === 0 && (h("digi-icon-check", { key: 'cc6d801fc6b2e1806f9ff8072597fffbff31bc5f', class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), this.afFilterButtonText)), this._filteredResult &&
+                    : 'false', "aria-checked": this._selectedItems.length === 0 ? 'true' : 'false', onClick: () => this.resetSelectItems(true), tabIndex: 0, "aria-label": this.afFilterButtonText }, this._selectedItems.length === 0 && (h("digi-icon-check", { key: '01cfe3f21036a55b97644fb03d915a5eea506694', class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), this.afFilterButtonText)), this._filteredResult &&
             this._filteredResult.map((item, index) => {
                 return (h("li", { class: "digi-form-select-filter__item", key: index, dir: item.dir, lang: item.lang, "aria-checked": this.isSelected(item.value) ? 'true' : 'false', role: this.afMultipleItems ? 'checkbox' : 'radio', "aria-required": this.afMultipleItems
                         ? 'false'
@@ -498,9 +499,9 @@ export class FormSelectFilter {
                             ? 'true'
                             : 'false'
                         : 'false', "aria-errormessage": `${this.afId}--validation-message`, onClick: () => this.selectItemHandler(item), tabIndex: this.showNeutralValue ? -1 : index === 0 ? 0 : -1 }, this.isSelected(item.value) && (h("digi-icon-check", { class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), item.label));
-            }))))), this.afMultipleItems && (h("div", { key: 'a7aa3909ebe7f3de53fbea9206e15f732d69ced5', class: "digi-form-select-filter__footer" }, !this.afHideResetButton && (h("digi-button", { key: 'aa1e8fad6451cca4a006e1844ee3a1f16cdb9a1c', "af-variation": "secondary", "af-aria-label": this.afResetButtonTextAriaLabel, onClick: () => this.resetSelectItems(), class: "digi-form-select-filter__reset-button" }, this.afResetButtonText)), h("digi-util-keydown-handler", { key: '8870fb15fd5bf10fd80876bdad9d719d71f6ce16', onAfOnUp: () => this.setFocusItem() }, h("digi-button", { key: '9df4e2914b2c62ac7da40b359c6b76239bb8a0f0', ref: (el) => (this._submitButton = el), "af-variation": "primary", "af-aria-label": this.afSubmitButtonTextAriaLabel, onClick: () => {
+            }))))), this.afMultipleItems && (h("div", { key: 'e0be65595bed741b5de8216ada9fe0d0de47ac3e', class: "digi-form-select-filter__footer" }, !this.afHideResetButton && (h("digi-button", { key: 'db69b04b4b2ab410a237198a23a3100b48ce6bdb', "af-variation": "secondary", "af-aria-label": this.afResetButtonTextAriaLabel, onClick: () => this.resetSelectItems(), class: "digi-form-select-filter__reset-button" }, this.afResetButtonText)), h("digi-util-keydown-handler", { key: '192df90619ef17bbf77e11a2467f09d80bd5fc36', onAfOnUp: () => this.setFocusItem() }, h("digi-button", { key: '05f35b1ce6b839803b437f686802ac5caba52dc8', ref: (el) => (this._submitButton = el), "af-variation": "primary", "af-aria-label": this.afSubmitButtonTextAriaLabel, onClick: () => {
                 this.setClosed(true);
-            }, class: "digi-form-select-filter__submit-button" }, this.afSubmitButtonText)))))), h("div", { key: '3b8f2f91f9a5dfd5ecb8e3bd924937796bb34d88', class: "digi-form-select__footer" }, h("div", { key: 'fb1463487aca42efbae8fd8c4424f88e9d1bfd6a', "aria-atomic": "true", role: "alert", id: `${this.afId}--validation-message` }, this.showValidation() && (h("digi-form-validation-message", { key: 'babf4bd8541386e13635dc8da6c42ef95b272fb6', "af-variation": this.afValidation }, this.afValidationText))))));
+            }, class: "digi-form-select-filter__submit-button" }, this.afSubmitButtonText)))))), h("div", { key: 'd9e0abd51c768bd874bfaff6da2c6b13fe9d279d', class: "digi-form-select__footer" }, h("div", { key: 'b80b09a64b27eebed494a5f4978f527c24fed3b0', "aria-atomic": "true", role: "alert", id: `${this.afId}--validation-message` }, this.showValidation() && (h("digi-form-validation-message", { key: 'b574f92b656755f9ee7f47d1c46dbff5e3b2ece8', "af-variation": this.afValidation }, this.afValidationText))))));
     }
     static get is() { return "digi-form-select-filter"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/_navigation/navigation-vertical-menu-item/navigation-vertical-menu-item.js

@@ -115,24 +115,24 @@ export class NavigationVerticalMenuItem {
         }
     }
     render() {
-        return (h("host", { key: '8802036fb23256a7b65a0fb08310ee7bdb352435', class: {
+        return (h("host", { key: '90998bfdc035aafce066f5c449b2baf7b22013a4', class: {
                 'digi-navigation-vertical-menu-item--has-subnav': this.hasSubnav,
                 'digi-navigation-vertical-menu-item--active-subnav': this.activeSubnav
-            } }, h("div", { key: '68db4dc17a2125a9ef0235bddeecb6d56eeb46a1', class: Object.assign({ 'digi-navigation-vertical-menu-item': true }, this.cssModifiers) }, this.hasSubnav && this.afHref && (h("div", { key: 'e2aebf6327c7039214679543a670094049e99ac9', class: "digi-navigation-vertical-menu-item__inner digi-navigation-vertical-menu-item__inner--combined" }, h("a", { key: '2c46d6d7a74dd66f4606d9f76eb7be5431a5ad16', id: `${this.afId}-link`, href: this.afHref, class: {
+            } }, h("div", { key: '5aa15246813f9c19cb5a11b51a3364f9c4c81ecb', class: Object.assign({ 'digi-navigation-vertical-menu-item': true }, this.cssModifiers) }, this.hasSubnav && this.afHref && (h("div", { key: '51a6359d7acd27c3233640291799c507cc9abea4', class: "digi-navigation-vertical-menu-item__inner digi-navigation-vertical-menu-item__inner--combined" }, h("a", { key: '05d2730b34df61b45cb4529ab06724d76135c2bf', id: `${this.afId}-link`, href: this.afHref, class: {
                 'digi-navigation-vertical-menu-item__link': true,
                 'digi-navigation-vertical-menu-item__has-subnav': true,
                 'digi-navigation-vertical-menu-item__link--active': this.isActive,
                 'digi-navigation-vertical-menu-item__link--expanded': this.activeSubnav
-            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: '83ccef6bf69abba28dc8bd5a602d34f4c78fa8a0', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: 'ea3fbcb2db6784bbf4e51b1254250c461a164396', name: "icon" })), h("span", { key: '811be918e3e7d307c29e228ba97e166d524d15ca', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: 'b89dfee61cdfc3371c49bf206779a1874b5bfe4c', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: '5cb9ed789b7d15190eb91958d89f187b85dab5f9', name: "badge" }))), h("button", { key: 'ef1ac35aab92f4b54813f4fd205ae8287efb6a28', type: "button", id: `${this.afId}-toggle-button`, class: {
+            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: '728fcec109a200b1bc88b94aa65a0cd95f7f26ec', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '3f8f7112d0b425241470c5895616217b88e337a2', name: "icon" })), h("span", { key: '16e6a72b7e54fc6a05418882809bfa3a5001d733', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: 'a71df07d1edcf382b014045c03f4dd3f24308a78', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: '333224149090b0511766d970337872255a037c40', name: "badge" }))), h("button", { key: '6225b3945f66c7d8309727972a6c78d5e389e089', type: "button", id: `${this.afId}-toggle-button`, class: {
                 'digi-navigation-vertical-menu-item__button digi-navigation-vertical-menu-item__button--toggle': true,
                 'digi-navigation-vertical-menu-item__button--active': this.isActive
-            }, onClick: (e) => this.clickHandler(e), "aria-controls": `${this.afId}-collapse-menu`, "aria-expanded": this.activeSubnav ? 'true' : 'false', "aria-label": `${this.toggleButtonText} ${this.afText}` }, h("span", { key: 'fe2458414620ddd82af502bc5940085adc6bfcc0', class: "digi-navigation-vertical-menu-item__toggle-icon" }, h("span", { key: 'e61d88b0b960d5953795e9ae044549e772598837', class: "icon" }, this.toggleIcon))))), this.hasSubnav && !this.afHref && (h("div", { key: '65e5d1c1c0959929ec2981627842b1df4e183b02', class: "digi-navigation-vertical-menu-item__inner" }, h("button", { key: '6ca204ea7cc5f6f0fa3d9b184336ffb5c0491b15', id: `${this.afId}-toggle-button`, class: "digi-navigation-vertical-menu-item__button digi-navigation-vertical-menu-item__button--only-toggle", onClick: (e) => this.clickHandler(e), "aria-controls": `${this.afId}-collapse-menu`, "aria-expanded": this.activeSubnav ? 'true' : 'false', type: "button" }, h("span", { key: 'fddd6d8667ef196428f2536252a86a4d15128b59', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: 'b8a5b123ca072ab2d7234f53bddeec1676009396', name: "icon" })), h("span", { key: '30eb2ec98d37a5fe365304f4e7f1b5a81950651f', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: '024daca3d4f0902aa2c539c0b6a907e5d8646365', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: '1ce40ca5ecb511731ab072e581ab1d3f1066b08a', name: "badge" })), h("span", { key: 'ade56bc496ee64aee49924ded618199cf25282c1', class: "digi-navigation-vertical-menu-item__toggle-icon" }, h("span", { key: '3888a43c5588d28af7cc92b21dffa4f00f7f31fe' }, this.toggleIcon))))), !this.hasSubnav && (h("div", { key: '56ad21d54d288a64833f2dee45cdc2caff4b0900', class: "digi-navigation-vertical-menu-item__inner" }, !this.isActive && (h("a", { key: '4f1d678879fe8c1e52cf810285b851e0d4de968b', id: `${this.afId}-link`, href: this.afHref, class: {
+            }, onClick: (e) => this.clickHandler(e), "aria-controls": `${this.afId}-collapse-menu`, "aria-expanded": this.activeSubnav ? 'true' : 'false', "aria-label": `${this.toggleButtonText} ${this.afText}` }, h("span", { key: '03cfa0a703525883cbed486d55e21f0977d8ba90', class: "digi-navigation-vertical-menu-item__toggle-icon" }, h("span", { key: '8085c37fb501a202dd892e2afd218cd961f23948', class: "icon" }, this.toggleIcon))))), this.hasSubnav && !this.afHref && (h("div", { key: '597bbb20edad42bff6cd072b3df0b4fc7b48ac85', class: "digi-navigation-vertical-menu-item__inner" }, h("button", { key: 'f1930269af1d34f9bb5dad7660e5316a5d55c9a1', id: `${this.afId}-toggle-button`, class: "digi-navigation-vertical-menu-item__button digi-navigation-vertical-menu-item__button--only-toggle", onClick: (e) => this.clickHandler(e), "aria-controls": `${this.afId}-collapse-menu`, "aria-expanded": this.activeSubnav ? 'true' : 'false', type: "button" }, h("span", { key: '7b2bc0c07007fd87f5d665f43ce0d543f09e5d71', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '938fc1e8f1aa2c61f96bb280639275cacfa7db91', name: "icon" })), h("span", { key: 'bdd05664a67e04fda3a70553cf07a5a9915eda55', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: '053bab38d026bde9be6440a9ef446e761da81fad', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: '338867e2b365f9912aec5c81200fcb2a5cfaf2b1', name: "badge" })), h("span", { key: '87275b1021b7257114f2c9d99335821c6de13696', class: "digi-navigation-vertical-menu-item__toggle-icon" }, h("span", { key: 'aa36f5138af4bf36029ddcb4a83a836c5a8bf455' }, this.toggleIcon))))), !this.hasSubnav && (h("div", { key: '63ad76cfdf49432658d6d9cb4dfad57283739136', class: "digi-navigation-vertical-menu-item__inner" }, !this.isActive && (h("a", { key: '6ed218c0c51b2444f5f3c3028554cfb38eee50ec', id: `${this.afId}-link`, href: this.afHref, class: {
                 'digi-navigation-vertical-menu-item__link': true,
                 'digi-navigation-vertical-menu-item__link--active': this.isActive
-            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: '776b5ee1fe04d3e9c2fd65e7cf7b9f44bd7496c9', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '1a1a2c49594045f69129dfe62685c42147ae9af5', name: "icon" })), h("span", { key: '7fb94127a356e581380737e8f314ad5000b4c62f', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: '7b62714044a5269b95327afe2bbac4d953944c28', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: '629658822c8c47e8781e1a139613a1f3c19028dd', name: "badge" })))), this.isActive && (h("a", { key: '8d95cbb822250940d9c397638eb686b2f8237ad1', id: `${this.afId}-link`, href: this.afHref, "aria-current": this.afAriaCurrent, class: {
+            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: '8f973191164b025edc6af194a4a51768c4c72e74', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '2f7ab8db20dcd3850af9041eda318a8732e2f79a', name: "icon" })), h("span", { key: 'ef02a477469133bbd5469f1a65d345e8fa445697', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: '29f5efe7b0397a2156cf1149b551e3de2356a606', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: 'f198a9ee32674f68c34b94243d9564c3cc359323', name: "badge" })))), this.isActive && (h("a", { key: 'b23cc5d4ef0c6795412628eedcea7330c6524f40', id: `${this.afId}-link`, href: this.afHref, "aria-current": this.afAriaCurrent, class: {
                 'digi-navigation-vertical-menu-item__link': true,
                 'digi-navigation-vertical-menu-item__link--active': this.isActive
-            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: 'd0741992a593822f65bc1382561bc8b166aaa40b', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '5a37bc0b2900a32db821290f9ff5315fb9d7ac4a', name: "icon" })), h("span", { key: '9cdcc98b4876a2c22e7f2fd9739a4a64db8abe1b', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: 'f7b1e6d63a5056242bc136904db9c0df4ca287f3', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: 'fa3bcf60bb9affa96f1c6817f9e8fd846ddf4e2b', name: "badge" })))))))));
+            }, onClick: (e) => this.clickHandler(e) }, h("div", { key: 'f8fffcbdc3b3e177dae3457b6997a2fc08e0dbcd', class: "digi-navigation-vertical-menu-item__icon", "aria-hidden": "true", hidden: !this.hasIcon }, h("slot", { key: '44aa12c4095825a0c9de923123778334d3c1a6b3', name: "icon" })), h("span", { key: 'd67c07434dec6d29dead94264bbb1a56b87b6dbc', class: "digi-navigation-vertical-menu-item__text", lang: this.afLang }, this.afText), h("div", { key: '0e627f689ca82f5eeea9f2cc86e1e8841323d55b', class: "digi-navigation-vertical-menu-item__badge", hidden: !this.hasBadge }, h("slot", { key: 'b70c627546c1358aeeea11ebc9aae3f015cbb160', name: "badge" })))))))));
     }
     static get is() { return "digi-navigation-vertical-menu-item"; }
     static get encapsulation() { return "scoped"; }
@@ -249,9 +249,9 @@ export class NavigationVerticalMenuItem {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Sets active item. Pass in true for default active"
+                            "text": "Sets active item visually. Pass in true for default active"
                         }],
-                    "text": "\u00C4ndrar aktiv status"
+                    "text": "Anv\u00E4nds f\u00F6r att markera ett menyval visuellt. S\u00E4tts till true f\u00F6r att visa det f\u00F6r n\u00E4rvarande valda (senast valda)."
                 },
                 "getter": false,
                 "setter": false,

package/dist/digi-arbetsformedlingen/design-tokens/components/_navigation-context-menu.variables.scss

@@ -109,4 +109,12 @@
 * @prop --digi--navigation-context-menu--item--border-top: var(--digi--border-width--primary) solid var(--digi--color--border--neutral-4);
 * @prop --digi--navigation-context-menu--items--margin: 0;
 * @prop --digi--navigation-context-menu--items--padding: var(--digi--gutter--large) 0;
+*/ont-size--desktop: var(--digi--typography--body--font-size--desktop-large);
+* @prop --digi--navigation-context-menu--item--background-color--active: var(--digi--color--background--neutral-6);
+* @prop --digi--navigation-context-menu--item--display: flex;
+* @prop --digi--navigation-context-menu--item--font-family: var(--digi--global--typography--font-family--default);
+* @prop --digi--navigation-context-menu--item--font-wight--selected: 600;
+* @prop --digi--navigation-context-menu--item--border-top: var(--digi--border-width--primary) solid var(--digi--color--border--neutral-4);
+* @prop --digi--navigation-context-menu--items--margin: 0;
+* @prop --digi--navigation-context-menu--items--padding: var(--digi--gutter--large) 0;
 */