npm - @fkui/vue - Versions diffs - 6.2.0 → 6.3.0 - Mend

@fkui/vue 6.2.0 → 6.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/cjs/index.cjs.js +852 -386
package/dist/cjs/index.cjs.js.map +1 -1
package/dist/esm/index.esm.js +853 -387
package/dist/esm/index.esm.js.map +1 -1
package/dist/types/index.d.ts +121 -63
package/dist/types/tsdoc-metadata.json +1 -1
package/htmlvalidate/elements/components.js +20 -0
package/htmlvalidate/elements/internal-components.js +1 -0
package/package.json +6 -6
package/tsconfig-consumer.json +1 -3

package/dist/cjs/index.cjs.js CHANGED Viewed

@@ -4,7 +4,7 @@ const vue = require("vue");
 const logic = require("@fkui/logic");
 const date = require("@fkui/date");
 const statuses = ["default", "warning", "error", "success", "info"];
-const _sfc_main$1c = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$1e = /* @__PURE__ */ vue.defineComponent({
   __name: "FBadge",
   props: {
     /**
@@ -162,10 +162,10 @@ function requireClassofRaw() {
   if (hasRequiredClassofRaw) return classofRaw;
   hasRequiredClassofRaw = 1;
   var uncurryThis = requireFunctionUncurryThis();
-  var toString = uncurryThis({}.toString);
+  var toString2 = uncurryThis({}.toString);
   var stringSlice = uncurryThis("".slice);
   classofRaw = function(it) {
-    return stringSlice(toString(it), 8, -1);
+    return stringSlice(toString2(it), 8, -1);
   };
   return classofRaw;
 }
@@ -234,16 +234,16 @@ function requireIsCallable() {
   };
   return isCallable;
 }
-var isObject;
+var isObject$1;
 var hasRequiredIsObject$1;
 function requireIsObject$1() {
-  if (hasRequiredIsObject$1) return isObject;
+  if (hasRequiredIsObject$1) return isObject$1;
   hasRequiredIsObject$1 = 1;
   var isCallable2 = requireIsCallable();
-  isObject = function(it) {
+  isObject$1 = function(it) {
     return typeof it == "object" ? it !== null : isCallable2(it);
   };
-  return isObject;
+  return isObject$1;
 }
 var getBuiltIn;
 var hasRequiredGetBuiltIn;
@@ -451,10 +451,10 @@ function requireSharedStore() {
   var SHARED = "__core-js_shared__";
   var store = sharedStore.exports = globalThis2[SHARED] || defineGlobalProperty2(SHARED, {});
   (store.versions || (store.versions = [])).push({
-    version: "3.40.0",
+    version: "3.41.0",
     mode: IS_PURE ? "pure" : "global",
     copyright: "© 2014-2025 Denis Pushkarev (zloirock.ru)",
-    license: "https://github.com/zloirock/core-js/blob/v3.40.0/LICENSE",
+    license: "https://github.com/zloirock/core-js/blob/v3.41.0/LICENSE",
     source: "https://github.com/zloirock/core-js"
   });
   return sharedStore.exports;
@@ -503,9 +503,9 @@ function requireUid() {
   var uncurryThis = requireFunctionUncurryThis();
   var id = 0;
   var postfix = Math.random();
-  var toString = uncurryThis(1 .toString);
+  var toString2 = uncurryThis(1 .toString);
   uid = function(key) {
-    return "Symbol(" + (key === void 0 ? "" : key) + ")_" + toString(++id + postfix, 36);
+    return "Symbol(" + (key === void 0 ? "" : key) + ")_" + toString2(++id + postfix, 36);
   };
   return uid;
 }
@@ -920,7 +920,7 @@ function requireMakeBuiltIn() {
     }
     return value;
   };
-  Function.prototype.toString = makeBuiltIn$1(function toString() {
+  Function.prototype.toString = makeBuiltIn$1(function toString2() {
     return isCallable2(this) && getInternalState(this).source || inspectSource2(this);
   }, "toString");
   return makeBuiltIn.exports;
@@ -1883,7 +1883,7 @@ function requireEs_array_push() {
 requireEs_array_push();
 const Flip = ["horizontal", "vertical"];
 const Rotate = ["90", "180", "270"];
-const _sfc_main$1b = vue.defineComponent({
+const _sfc_main$1d = vue.defineComponent({
   name: "FIcon",
   inheritAttrs: false,
   props: {
@@ -1971,8 +1971,8 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _hoisted_1$V = ["aria-hidden"];
-const _hoisted_2$F = ["xlink:href"];
+const _hoisted_1$X = ["aria-hidden"];
+const _hoisted_2$G = ["xlink:href"];
 function _sfc_render$R(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps(_ctx.$attrs, {
     focusable: "false",
@@ -1980,9 +1980,9 @@ function _sfc_render$R(_ctx, _cache, $props, $setup, $data, $options) {
     "aria-hidden": _ctx.ariaHidden
   }), [vue.renderSlot(_ctx.$slots, "default"), _cache[0] || (_cache[0] = vue.createTextVNode()), vue.createElementVNode("use", {
     "xlink:href": _ctx.spriteId
-  }, null, 8, _hoisted_2$F)], 16, _hoisted_1$V);
+  }, null, 8, _hoisted_2$G)], 16, _hoisted_1$X);
 }
-const FIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1b, [["render", _sfc_render$R]]);
+const FIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1d, [["render", _sfc_render$R]]);
 const DATA_TEST_ATTRIBUTE_NAME = "data-test";
 function throwErrorIfEmpty(value) {
   if (!value) {
@@ -4420,7 +4420,7 @@ function elementIsRadioButton(element) {
 function isHTMLInputElement(element) {
   return element instanceof HTMLInputElement;
 }
-const _sfc_main$1a = vue.defineComponent({
+const _sfc_main$1c = vue.defineComponent({
   name: "FModal",
   components: {
     FIcon
@@ -4600,8 +4600,8 @@ const _sfc_main$1a = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$U = ["id"];
-const _hoisted_2$E = {
+const _hoisted_1$W = ["id"];
+const _hoisted_2$F = {
   class: "modal__backdrop"
 };
 const _hoisted_3$w = {
@@ -4630,7 +4630,7 @@ const _hoisted_8$8 = {
 const _hoisted_9$6 = {
   class: "modal__footer"
 };
-const _hoisted_10$4 = {
+const _hoisted_10$3 = {
   class: "modal__shelf"
 };
 const _hoisted_11$3 = ["aria-label"];
@@ -4640,7 +4640,7 @@ function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
     key: 0,
     id: _ctx.id,
     class: vue.normalizeClass(["modal", _ctx.modalClass])
-  }, [vue.createElementVNode("div", _hoisted_2$E, [vue.createElementVNode("div", {
+  }, [vue.createElementVNode("div", _hoisted_2$F, [vue.createElementVNode("div", {
     class: "modal__outer-container scroll-target",
     tabindex: "-1",
     role: "dialog",
@@ -4652,7 +4652,7 @@ function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
   }, [vue.createElementVNode("div", _hoisted_4$q, [vue.createElementVNode("div", _hoisted_5$l, [vue.createElementVNode("div", _hoisted_6$g, [vue.createElementVNode("div", {
     tabindex: "0",
     onFocus: _cache[0] || (_cache[0] = (...args) => _ctx.onFocusFirst && _ctx.onFocusFirst(...args))
-  }, null, 32), _cache[4] || (_cache[4] = vue.createTextVNode()), _ctx.hasHeaderSlot ? (vue.openBlock(), vue.createElementBlock("h1", _hoisted_7$d, [vue.renderSlot(_ctx.$slots, "header")], 512)) : vue.createCommentVNode("", true)]), _cache[5] || (_cache[5] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_8$8, [vue.renderSlot(_ctx.$slots, "content")], 512), _cache[6] || (_cache[6] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_9$6, [vue.renderSlot(_ctx.$slots, "footer")])]), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_10$4, [vue.createElementVNode("button", {
+  }, null, 32), _cache[4] || (_cache[4] = vue.createTextVNode()), _ctx.hasHeaderSlot ? (vue.openBlock(), vue.createElementBlock("h1", _hoisted_7$d, [vue.renderSlot(_ctx.$slots, "header")], 512)) : vue.createCommentVNode("", true)]), _cache[5] || (_cache[5] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_8$8, [vue.renderSlot(_ctx.$slots, "content")], 512), _cache[6] || (_cache[6] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_9$6, [vue.renderSlot(_ctx.$slots, "footer")])]), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_10$3, [vue.createElementVNode("button", {
     type: "button",
     class: "close-button",
     "aria-label": _ctx.ariaCloseText,
@@ -4662,9 +4662,9 @@ function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
   })], 8, _hoisted_11$3), _cache[8] || (_cache[8] = vue.createTextVNode()), vue.createElementVNode("div", {
     tabindex: "0",
     onFocus: _cache[2] || (_cache[2] = (...args) => _ctx.onFocusLast && _ctx.onFocusLast(...args))
-  }, null, 32)])])], 2)])], 32)])], 10, _hoisted_1$U)) : vue.createCommentVNode("", true);
+  }, null, 32)])])], 2)])], 32)])], 10, _hoisted_1$W)) : vue.createCommentVNode("", true);
 }
-const FModal = /* @__PURE__ */ _export_sfc(_sfc_main$1a, [["render", _sfc_render$Q]]);
+const FModal = /* @__PURE__ */ _export_sfc(_sfc_main$1c, [["render", _sfc_render$Q]]);
 function prepareButtonList(src, buttonOrder = config.buttonOrder) {
   const list = src.map((it) => {
     var _it$event, _ref, _it$reason, _it$type;
@@ -4693,7 +4693,7 @@ const defaultButtons = [{
   event: "dismiss",
   type: "secondary"
 }];
-const _sfc_main$19 = vue.defineComponent({
+const _sfc_main$1b = vue.defineComponent({
   name: "FConfirmModal",
   components: {
     FModal
@@ -4797,10 +4797,10 @@ const _sfc_main$19 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$T = {
+const _hoisted_1$V = {
   class: "button-group"
 };
-const _hoisted_2$D = ["onClick"];
+const _hoisted_2$E = ["onClick"];
 const _hoisted_3$v = {
   key: 0,
   class: "sr-only"
@@ -4818,22 +4818,22 @@ function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
   }, {
     header: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "heading", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.heading), 1)])]),
     content: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "content", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.content), 1)])]),
-    footer: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$T, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.preparedButtons, (button) => {
+    footer: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$V, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.preparedButtons, (button) => {
       return vue.openBlock(), vue.createElementBlock("button", {
         key: button.label,
         type: "button",
         class: vue.normalizeClass([button.classlist, "button-group__item"]),
         onClick: ($event) => _ctx.onClick(button)
-      }, [vue.createElementVNode("span", null, vue.toDisplayString(button.label), 1), _cache[0] || (_cache[0] = vue.createTextVNode()), button.screenreader ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$v, " " + vue.toDisplayString(button.screenreader), 1)) : vue.createCommentVNode("", true)], 10, _hoisted_2$D);
+      }, [vue.createElementVNode("span", null, vue.toDisplayString(button.label), 1), _cache[0] || (_cache[0] = vue.createTextVNode()), button.screenreader ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$v, " " + vue.toDisplayString(button.screenreader), 1)) : vue.createCommentVNode("", true)], 10, _hoisted_2$E);
     }), 128))])]),
     _: 3
   }, 8, ["fullscreen", "is-open", "aria-close-text", "size", "focus", "onClose"]);
 }
-const FConfirmModal = /* @__PURE__ */ _export_sfc(_sfc_main$19, [["render", _sfc_render$P]]);
+const FConfirmModal = /* @__PURE__ */ _export_sfc(_sfc_main$1b, [["render", _sfc_render$P]]);
 const GAP = ["1x", "2x", "3x", "4x", "5x", "6x", "7x", "8x"];
 const ALIGNMENT = ["top", "center", "bottom"];
 const FLOAT = ["left", "center", "right"];
-const _sfc_main$18 = vue.defineComponent({
+const _sfc_main$1a = vue.defineComponent({
   name: "IFlex",
   inheritAttrs: true,
   props: {
@@ -4913,8 +4913,8 @@ function _sfc_render$O(_ctx, _cache, $props, $setup, $data, $options) {
     class: vue.normalizeClass(["iflex", _ctx.classList])
   }, [vue.renderSlot(_ctx.$slots, "default")], 2);
 }
-const IFlex = /* @__PURE__ */ _export_sfc(_sfc_main$18, [["render", _sfc_render$O]]);
-const _sfc_main$17 = vue.defineComponent({
+const IFlex = /* @__PURE__ */ _export_sfc(_sfc_main$1a, [["render", _sfc_render$O]]);
+const _sfc_main$19 = vue.defineComponent({
   name: "IFlexItem",
   inheritAttrs: true,
   props: {
@@ -4966,7 +4966,7 @@ function _sfc_render$N(_ctx, _cache, $props, $setup, $data, $options) {
     class: vue.normalizeClass(["iflex__item", _ctx.classList])
   }, [vue.renderSlot(_ctx.$slots, "default")], 2);
 }
-const IFlexItem = /* @__PURE__ */ _export_sfc(_sfc_main$17, [["render", _sfc_render$N]]);
+const IFlexItem = /* @__PURE__ */ _export_sfc(_sfc_main$19, [["render", _sfc_render$N]]);
 function focusError(item) {
   const element = document.querySelector(`#${item.id}`);
   if (!element) {
@@ -4976,7 +4976,7 @@ function focusError(item) {
   logic.scrollTo(element, window.innerHeight * 0.25);
   logic.focus(focusElement2 ? focusElement2 : element);
 }
-const _sfc_main$16 = vue.defineComponent({
+const _sfc_main$18 = vue.defineComponent({
   name: "FErrorList",
   components: {
     FIcon,
@@ -5032,10 +5032,10 @@ const _sfc_main$16 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$S = {
+const _hoisted_1$U = {
   class: "error-list"
 };
-const _hoisted_2$C = {
+const _hoisted_2$D = {
   key: 0
 };
 const _hoisted_3$u = {
@@ -5049,7 +5049,7 @@ function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
   const _component_i_flex_item = vue.resolveComponent("i-flex-item");
   const _component_i_flex = vue.resolveComponent("i-flex");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$S, [vue.createVNode(_component_i_flex, null, {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$U, [vue.createVNode(_component_i_flex, null, {
     default: vue.withCtx(() => [_ctx.hasTitleSlot ? (vue.openBlock(), vue.createBlock(_component_i_flex_item, {
       key: 0,
       shrink: ""
@@ -5068,7 +5068,7 @@ function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
     })) : vue.createCommentVNode("", true), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createVNode(_component_i_flex_item, {
       grow: ""
     }, {
-      default: vue.withCtx(() => [_ctx.hasTitleSlot ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$C, [vue.renderSlot(_ctx.$slots, "title")])) : vue.createCommentVNode("", true), _cache[5] || (_cache[5] = vue.createTextVNode()), vue.createElementVNode("ul", _hoisted_3$u, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item) => {
+      default: vue.withCtx(() => [_ctx.hasTitleSlot ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$D, [vue.renderSlot(_ctx.$slots, "title")])) : vue.createCommentVNode("", true), _cache[5] || (_cache[5] = vue.createTextVNode()), vue.createElementVNode("ul", _hoisted_3$u, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item) => {
         return vue.openBlock(), vue.createElementBlock("li", {
           key: item.id,
           class: vue.normalizeClass(_ctx.liClasses(item))
@@ -5099,7 +5099,7 @@ function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   })]);
 }
-const FErrorList = /* @__PURE__ */ _export_sfc(_sfc_main$16, [["render", _sfc_render$M]]);
+const FErrorList = /* @__PURE__ */ _export_sfc(_sfc_main$18, [["render", _sfc_render$M]]);
 var es_iterator_every = {};
 var hasRequiredEs_iterator_every;
 function requireEs_iterator_every() {
@@ -5187,7 +5187,7 @@ function cleanUpElements(vm) {
     }, 0);
   });
 }
-const _sfc_main$15 = vue.defineComponent({
+const _sfc_main$17 = vue.defineComponent({
   name: "FValidationGroup",
   props: {
     /**
@@ -5263,13 +5263,13 @@ function _sfc_render$L(_ctx, _cache, $props, $setup, $data, $options) {
     onComponentUnmount: _cache[1] || (_cache[1] = (...args) => _ctx.onComponentUnmount && _ctx.onComponentUnmount(...args))
   }, [vue.renderSlot(_ctx.$slots, "default")], 32);
 }
-const FValidationGroup = /* @__PURE__ */ _export_sfc(_sfc_main$15, [["render", _sfc_render$L]]);
+const FValidationGroup = /* @__PURE__ */ _export_sfc(_sfc_main$17, [["render", _sfc_render$L]]);
 var FValidationFormAction = /* @__PURE__ */ ((FValidationFormAction2) => {
   FValidationFormAction2[FValidationFormAction2["CONTINUE"] = 0] = "CONTINUE";
   FValidationFormAction2[FValidationFormAction2["CANCEL"] = 1] = "CANCEL";
   return FValidationFormAction2;
 })(FValidationFormAction || {});
-const _sfc_main$14 = vue.defineComponent({
+const _sfc_main$16 = vue.defineComponent({
   name: "FValidationForm",
   components: {
     FValidationGroup,
@@ -5408,8 +5408,8 @@ const _sfc_main$14 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$R = ["id"];
-const _hoisted_2$B = {
+const _hoisted_1$T = ["id"];
+const _hoisted_2$C = {
   key: 0,
   ref: "errors",
   tabindex: "-1",
@@ -5430,19 +5430,19 @@ function _sfc_render$K(_ctx, _cache, $props, $setup, $data, $options) {
       novalidate: "",
       autocomplete: "off",
       onSubmit: _cache[0] || (_cache[0] = vue.withModifiers((...args) => _ctx.onSubmit && _ctx.onSubmit(...args), ["prevent"]))
-    }), [_ctx.displayErrors ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_2$B, [vue.createVNode(_component_f_error_list, {
+    }), [_ctx.displayErrors ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_2$C, [vue.createVNode(_component_f_error_list, {
       items: _ctx.errors,
       bullets: _ctx.errorListBullets,
       "before-navigate": _ctx.errorListBeforeNavigate
     }, {
       title: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "error-message")]),
       _: 3
-    }, 8, ["items", "bullets", "before-navigate"])], 512)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$R)]),
+    }, 8, ["items", "bullets", "before-navigate"])], 512)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$T)]),
     _: 3
   }, 8, ["modelValue"]);
 }
-const FValidationForm = /* @__PURE__ */ _export_sfc(_sfc_main$14, [["render", _sfc_render$K]]);
-const _sfc_main$13 = vue.defineComponent({
+const FValidationForm = /* @__PURE__ */ _export_sfc(_sfc_main$16, [["render", _sfc_render$K]]);
+const _sfc_main$15 = vue.defineComponent({
   name: "FFormModal",
   components: {
     FModal,
@@ -5591,10 +5591,10 @@ const _sfc_main$13 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$Q = {
+const _hoisted_1$S = {
   class: "button-group"
 };
-const _hoisted_2$A = ["type", "form", "onClick"];
+const _hoisted_2$B = ["type", "form", "onClick"];
 const _hoisted_3$t = {
   key: 0,
   class: "sr-only"
@@ -5623,19 +5623,19 @@ function _sfc_render$J(_ctx, _cache, $props, $setup, $data, $options) {
       default: vue.withCtx(() => [_cache[0] || (_cache[0] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "input-text-fields")]),
       _: 3
     }, 8, ["id", "before-submit", "before-validation", "use-error-list", "onSubmit", "onCancel"])]),
-    footer: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$Q, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.preparedButtons, (button) => {
+    footer: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$S, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.preparedButtons, (button) => {
       return vue.openBlock(), vue.createElementBlock("button", {
         key: button.label,
         type: button.buttonType,
         class: vue.normalizeClass([button.classlist, "button-group__item"]),
         form: button.buttonType === "submit" ? _ctx.formId : void 0,
         onClick: ($event) => button.buttonType === "button" ? _ctx.onCancel() : false
-      }, [vue.createElementVNode("span", null, vue.toDisplayString(button.label), 1), _cache[2] || (_cache[2] = vue.createTextVNode()), button.screenreader ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$t, " " + vue.toDisplayString(button.screenreader), 1)) : vue.createCommentVNode("", true)], 10, _hoisted_2$A);
+      }, [vue.createElementVNode("span", null, vue.toDisplayString(button.label), 1), _cache[2] || (_cache[2] = vue.createTextVNode()), button.screenreader ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$t, " " + vue.toDisplayString(button.screenreader), 1)) : vue.createCommentVNode("", true)], 10, _hoisted_2$B);
     }), 128))])]),
     _: 3
   }, 8, ["data-test", "fullscreen", "is-open", "size", "aria-close-text", "onClose"]);
 }
-const FFormModal = /* @__PURE__ */ _export_sfc(_sfc_main$13, [["render", _sfc_render$J]]);
+const FFormModal = /* @__PURE__ */ _export_sfc(_sfc_main$15, [["render", _sfc_render$J]]);
 async function confirmModal(callingInstance, texts) {
   const buttons = [{
     label: texts.confirm,
@@ -5995,7 +5995,7 @@ const ErrorPlugin = {
     }
   }
 };
-const _sfc_main$12 = vue.defineComponent({
+const _sfc_main$14 = vue.defineComponent({
   name: "FErrorPage",
   props: {
     payload: {
@@ -6005,16 +6005,16 @@ const _sfc_main$12 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$P = {
+const _hoisted_1$R = {
   "data-test": "f-error-page"
 };
 function _sfc_render$I(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$P, _cache[0] || (_cache[0] = [vue.createElementVNode("h1", null, "Fel", -1), vue.createTextVNode(), vue.createElementVNode("p", null, "Ett fel har uppstått.", -1), vue.createTextVNode(), vue.createElementVNode("a", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$R, _cache[0] || (_cache[0] = [vue.createElementVNode("h1", null, "Fel", -1), vue.createTextVNode(), vue.createElementVNode("p", null, "Ett fel har uppstått.", -1), vue.createTextVNode(), vue.createElementVNode("a", {
     href: "/"
   }, "Gå till startsidan", -1)]));
 }
-const FErrorPage = /* @__PURE__ */ _export_sfc(_sfc_main$12, [["render", _sfc_render$I]]);
-const _sfc_main$11 = vue.defineComponent({
+const FErrorPage = /* @__PURE__ */ _export_sfc(_sfc_main$14, [["render", _sfc_render$I]]);
+const _sfc_main$13 = vue.defineComponent({
   name: "FErrorHandlingApp",
   props: {
     defaultComponent: {
@@ -6053,7 +6053,7 @@ function _sfc_render$H(_ctx, _cache, $props, $setup, $data, $options) {
     key: 2
   })]);
 }
-const FErrorHandlingApp = /* @__PURE__ */ _export_sfc(_sfc_main$11, [["render", _sfc_render$H]]);
+const FErrorHandlingApp = /* @__PURE__ */ _export_sfc(_sfc_main$13, [["render", _sfc_render$H]]);
 function isMonthBefore(date2, minDate) {
   return Boolean(minDate && date2.isBefore(minDate.startOfMonth()));
 }
@@ -6094,7 +6094,7 @@ function getMessage($t2, date2, minDate, maxDate) {
     });
   }
 }
-const _sfc_main$10 = vue.defineComponent({
+const _sfc_main$12 = vue.defineComponent({
   name: "ICalendarNavbar",
   components: {
     FIcon
@@ -6207,10 +6207,10 @@ const _sfc_main$10 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$O = {
+const _hoisted_1$Q = {
   class: "calendar-navbar"
 };
-const _hoisted_2$z = {
+const _hoisted_2$A = {
   class: "calendar-navbar__month",
   tabindex: "-1"
 };
@@ -6224,7 +6224,7 @@ const _hoisted_6$f = {
 };
 function _sfc_render$G(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$O, [vue.createElementVNode("div", _hoisted_2$z, vue.toDisplayString(_ctx.currentText), 1), _cache[4] || (_cache[4] = vue.createTextVNode()), vue.createElementVNode("button", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$Q, [vue.createElementVNode("div", _hoisted_2$A, vue.toDisplayString(_ctx.currentText), 1), _cache[4] || (_cache[4] = vue.createTextVNode()), vue.createElementVNode("button", {
     ref: "previousButton",
     class: "calendar-navbar__arrow calendar-navbar__arrow--previous",
     type: "button",
@@ -6246,14 +6246,14 @@ function _sfc_render$G(_ctx, _cache, $props, $setup, $data, $options) {
     name: "arrow-right"
   }, null, 8, ["class"])], 8, _hoisted_5$j)]);
 }
-const ICalendarNavbar = /* @__PURE__ */ _export_sfc(_sfc_main$10, [["render", _sfc_render$G]]);
+const ICalendarNavbar = /* @__PURE__ */ _export_sfc(_sfc_main$12, [["render", _sfc_render$G]]);
 function getDayStartOffset(days) {
   return days[0].weekDay - 1;
 }
 function getDayEndOffset(days) {
   return 7 - days[days.length - 1].weekDay;
 }
-const _sfc_main$$ = vue.defineComponent({
+const _sfc_main$11 = vue.defineComponent({
   name: "ICalendarMonthGrid",
   props: {
     /**
@@ -6327,8 +6327,8 @@ const _sfc_main$$ = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$N = ["aria-label"];
-const _hoisted_2$y = {
+const _hoisted_1$P = ["aria-label"];
+const _hoisted_2$z = {
   key: 0,
   class: "calendar-month__col--week"
 };
@@ -6353,7 +6353,7 @@ const _hoisted_9$5 = {
   key: 0,
   "aria-hidden": "true"
 };
-const _hoisted_10$3 = ["colspan"];
+const _hoisted_10$2 = ["colspan"];
 const _hoisted_11$2 = {
   key: 1,
   "aria-hidden": "true"
@@ -6366,7 +6366,7 @@ function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
     "aria-label": _ctx.ariaLabel,
     onFocusin: _cache[0] || (_cache[0] = (...args) => _ctx.onFocusin && _ctx.onFocusin(...args)),
     onFocusout: _cache[1] || (_cache[1] = (...args) => _ctx.onFocusout && _ctx.onFocusout(...args))
-  }, [vue.createElementVNode("colgroup", null, [!_ctx.internalHideWeekNumbers ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_2$y)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), _cache[3] || (_cache[3] = vue.createElementVNode("col", {
+  }, [vue.createElementVNode("colgroup", null, [!_ctx.internalHideWeekNumbers ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_2$z)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), _cache[3] || (_cache[3] = vue.createElementVNode("col", {
     class: "calendar-month__col--day"
   }, null, -1)), _cache[4] || (_cache[4] = vue.createTextVNode()), _cache[5] || (_cache[5] = vue.createElementVNode("col", {
     class: "calendar-month__col--day"
@@ -6416,13 +6416,13 @@ function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
     class: "calendar-month__cell",
     colspan: _ctx.totalCols,
     "aria-hidden": "true"
-  }, null, 8, _hoisted_10$3)])) : vue.createCommentVNode("", true), _cache[21] || (_cache[21] = vue.createTextVNode()), _ctx.weeks.length < 6 ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_11$2, [vue.createElementVNode("td", {
+  }, null, 8, _hoisted_10$2)])) : vue.createCommentVNode("", true), _cache[21] || (_cache[21] = vue.createTextVNode()), _ctx.weeks.length < 6 ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_11$2, [vue.createElementVNode("td", {
     class: "calendar-month__cell",
     colspan: _ctx.totalCols,
     "aria-hidden": "true"
-  }, null, 8, _hoisted_12$2)])) : vue.createCommentVNode("", true)])], 40, _hoisted_1$N);
+  }, null, 8, _hoisted_12$2)])) : vue.createCommentVNode("", true)])], 40, _hoisted_1$P);
 }
-const ICalendarMonthGrid = /* @__PURE__ */ _export_sfc(_sfc_main$$, [["render", _sfc_render$F]]);
+const ICalendarMonthGrid = /* @__PURE__ */ _export_sfc(_sfc_main$11, [["render", _sfc_render$F]]);
 const DayStep = {
   ArrowRight: 1,
   ArrowLeft: -1,
@@ -6446,7 +6446,7 @@ function getDayTabindex(date2, active, entry) {
     return date2.day === 1 ? 0 : -1;
   }
 }
-const _sfc_main$_ = vue.defineComponent({
+const _sfc_main$10 = vue.defineComponent({
   name: "ICalendarMonth",
   components: {
     ICalendarMonthGrid
@@ -6536,7 +6536,7 @@ const _sfc_main$_ = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$M = ["data-date", "tabindex", "onClick", "onKeydown"];
+const _hoisted_1$O = ["data-date", "tabindex", "onClick", "onKeydown"];
 function _sfc_render$E(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_i_calendar_month_grid = vue.resolveComponent("i-calendar-month-grid");
   return vue.openBlock(), vue.createBlock(_component_i_calendar_month_grid, {
@@ -6556,12 +6556,12 @@ function _sfc_render$E(_ctx, _cache, $props, $setup, $data, $options) {
     }, [vue.renderSlot(_ctx.$slots, "default", {
       date: date2,
       isFocused: _ctx.isDayFocused(date2)
-    })], 40, _hoisted_1$M)]),
+    })], 40, _hoisted_1$O)]),
     _: 3
   }, 8, ["value"]);
 }
-const ICalendarMonth = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["render", _sfc_render$E]]);
-const _sfc_main$Z = vue.defineComponent({
+const ICalendarMonth = /* @__PURE__ */ _export_sfc(_sfc_main$10, [["render", _sfc_render$E]]);
+const _sfc_main$$ = vue.defineComponent({
   name: "FCalendar",
   components: {
     ICalendarNavbar,
@@ -6612,13 +6612,13 @@ const _sfc_main$Z = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$L = {
+const _hoisted_1$N = {
   class: "calendar__wrapper"
 };
 function _sfc_render$D(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_i_calendar_navbar = vue.resolveComponent("i-calendar-navbar");
   const _component_i_calendar_month = vue.resolveComponent("i-calendar-month");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$L, [vue.createVNode(_component_i_calendar_navbar, {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$N, [vue.createVNode(_component_i_calendar_navbar, {
     "model-value": _ctx.modelValue,
     "min-date": _ctx.minDate,
     "max-date": _ctx.maxDate,
@@ -6641,7 +6641,7 @@ function _sfc_render$D(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["model-value", "min-date", "max-date", "tab-date", "onClick", "onUpdate:modelValue"])]);
 }
-const FCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$Z, [["render", _sfc_render$D]]);
+const FCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$$, [["render", _sfc_render$D]]);
 function getCalendarDaySrText(day, enabled, selected, t) {
   const parts = [];
   if (!enabled) {
@@ -6660,7 +6660,7 @@ function getCalendarDaySrText(day, enabled, selected, t) {
   parts.push(day.toString(date.DateFormat.FULL));
   return parts.join(" ");
 }
-const _sfc_main$Y = vue.defineComponent({
+const _sfc_main$_ = vue.defineComponent({
   name: "FCalendarDay",
   mixins: [TranslationMixin],
   props: {
@@ -6725,19 +6725,19 @@ const _sfc_main$Y = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$K = {
+const _hoisted_1$M = {
   "aria-hidden": "true"
 };
-const _hoisted_2$x = {
+const _hoisted_2$y = {
   class: "sr-only"
 };
 function _sfc_render$C(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("span", {
     class: vue.normalizeClass(_ctx.dayClasses)
-  }, [vue.createElementVNode("span", _hoisted_1$K, vue.toDisplayString(_ctx.day.day), 1), _cache[0] || (_cache[0] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_2$x, vue.toDisplayString(_ctx.srText), 1)], 2);
+  }, [vue.createElementVNode("span", _hoisted_1$M, vue.toDisplayString(_ctx.day.day), 1), _cache[0] || (_cache[0] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_2$y, vue.toDisplayString(_ctx.srText), 1)], 2);
 }
-const FCalendarDay = /* @__PURE__ */ _export_sfc(_sfc_main$Y, [["render", _sfc_render$C]]);
-function useEventListener(target, event, callback) {
+const FCalendarDay = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["render", _sfc_render$C]]);
+function useEventListener$1(target, event, callback) {
   vue.onMounted(() => {
     var _a;
     (_a = vue.toValue(target)) == null ? void 0 : _a.addEventListener(event, callback);
@@ -6757,8 +6757,8 @@ function useSlotUtils() {
     }
   };
 }
-const _hoisted_1$J = ["id"];
-const _hoisted_2$w = {
+const _hoisted_1$L = ["id"];
+const _hoisted_2$x = {
   key: 0,
   class: "card__header"
 };
@@ -6769,7 +6769,7 @@ const _hoisted_4$m = {
   key: 1,
   class: "card__footer"
 };
-const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$Z = /* @__PURE__ */ vue.defineComponent({
   __name: "FCard",
   props: {
     /**
@@ -6827,7 +6827,7 @@ const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
         id: __props.id,
         class: vue.normalizeClass(cardClass.value),
         onValidity
-      }, [hasHeaderSlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$w, [vue.renderSlot(_ctx.$slots, "header", vue.normalizeProps(vue.guardReactiveProps({
+      }, [hasHeaderSlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$x, [vue.renderSlot(_ctx.$slots, "header", vue.normalizeProps(vue.guardReactiveProps({
         headingSlotClass: "card__header-label"
       })))])) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "error-message", vue.normalizeProps(vue.guardReactiveProps({
         hasError: hasError.value,
@@ -6855,11 +6855,11 @@ const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
       })) : vue.createCommentVNode("", true)]), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_3$q, [vue.renderSlot(_ctx.$slots, "default")]), _cache[3] || (_cache[3] = vue.createTextVNode()), hasFooterSlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$m, [vue.renderSlot(_ctx.$slots, "footer", vue.normalizeProps(vue.guardReactiveProps({
         hasError: hasError.value,
         validationMessage: validationMessage.value
-      })))])) : vue.createCommentVNode("", true)], 42, _hoisted_1$J);
+      })))])) : vue.createCommentVNode("", true)], 42, _hoisted_1$L);
     };
   }
 });
-const _sfc_main$W = vue.defineComponent({
+const _sfc_main$Y = vue.defineComponent({
   name: "FExpand",
   data() {
     return {
@@ -6925,7 +6925,7 @@ function _sfc_render$B(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["onEnter", "onAfterEnter", "onLeave"]);
 }
-const FExpand = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["render", _sfc_render$B]]);
+const FExpand = /* @__PURE__ */ _export_sfc(_sfc_main$Y, [["render", _sfc_render$B]]);
 function offset(page, el) {
   const rect = el.getBoundingClientRect();
   return {
@@ -7210,7 +7210,7 @@ function isTeleportDisabled(options) {
   }
   return disableTeleport;
 }
-const _sfc_main$V = vue.defineComponent({
+const _sfc_main$X = vue.defineComponent({
   name: "IPopup",
   inheritAttrs: false,
   props: {
@@ -7512,7 +7512,7 @@ function _sfc_render$A(_ctx, _cache, $props, $setup, $data, $options) {
     placement: _ctx.placement
   })))], 544)], 16)], 8, ["to", "disabled"])) : vue.createCommentVNode("", true);
 }
-const IPopup = /* @__PURE__ */ _export_sfc(_sfc_main$V, [["render", _sfc_render$A]]);
+const IPopup = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["render", _sfc_render$A]]);
 function computeArrowOffset(placement, inputIconRect, wrapperRect) {
   switch (placement) {
     case Placement.A: {
@@ -7576,7 +7576,7 @@ function computeArrowOffset(placement, inputIconRect, wrapperRect) {
   }
 }
 const POPUP_SPACING = 10;
-const _sfc_main$U = vue.defineComponent({
+const _sfc_main$W = vue.defineComponent({
   name: "IPopupError",
   components: {
     FIcon
@@ -7714,7 +7714,7 @@ const _sfc_main$U = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$I = {
+const _hoisted_1$K = {
   ref: "wrapper",
   class: "popup-error__wrapper"
 };
@@ -7728,7 +7728,7 @@ function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
     ref: "popup",
     class: vue.normalizeClass(_ctx.popupClasses),
     "aria-hidden": "true"
-  }, [vue.createElementVNode("div", _hoisted_1$I, [vue.createElementVNode("div", {
+  }, [vue.createElementVNode("div", _hoisted_1$K, [vue.createElementVNode("div", {
     class: vue.normalizeClass(_ctx.arrowClass),
     style: vue.normalizeStyle(_ctx.errorStyle)
   }, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.errorMessage), 1), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createElementVNode("button", {
@@ -7742,7 +7742,7 @@ function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
     class: "button__icon"
   })])], 6)], 512)], 2)], 8, ["to", "disabled"])) : vue.createCommentVNode("", true);
 }
-const IPopupError = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["render", _sfc_render$z]]);
+const IPopupError = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["render", _sfc_render$z]]);
 function numItems(itemHeight, availableHeight, verticalSpacing) {
   const itemsFit = Math.floor((availableHeight - verticalSpacing) / itemHeight);
   return Math.min(itemsFit, 7);
@@ -7809,12 +7809,12 @@ function computeListboxRect(anchor, options, root = document.documentElement, {
   }
   return void 0;
 }
-const _hoisted_1$H = ["onKeyup"];
-const _hoisted_2$v = {
+const _hoisted_1$J = ["onKeyup"];
+const _hoisted_2$w = {
   ref: "content"
 };
 const teleportDisabled = false;
-const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
   __name: "IPopupListbox",
   props: {
     isOpen: {
@@ -7836,7 +7836,7 @@ const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
     const teleportTarget = vue.computed(() => config.teleportTarget);
     let guessedItemHeight = void 0;
     let verticalSpacing = void 0;
-    useEventListener(__props.anchor, "keyup", onKeyEsc);
+    useEventListener$1(__props.anchor, "keyup", onKeyEsc);
     vue.watchEffect(() => {
       if (wrapperRef.value && __props.activeElement !== void 0) {
         const centerPosition = __props.activeElement.offsetTop - (wrapperRef.value.getBoundingClientRect().height - __props.activeElement.getBoundingClientRect().height) / 2;
@@ -7968,7 +7968,7 @@ const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
         onKeyup: vue.withKeys(vue.withModifiers(onKeyEsc, ["stop"]), ["esc"]),
         onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
         }, ["stop"]))
-      }), [vue.createElementVNode("div", _hoisted_2$v, [vue.renderSlot(_ctx.$slots, "default")], 512)], 16, _hoisted_1$H)], 512)], 8, ["to"])) : vue.createCommentVNode("", true);
+      }), [vue.createElementVNode("div", _hoisted_2$w, [vue.renderSlot(_ctx.$slots, "default")], 512)], 16, _hoisted_1$J)], 512)], 8, ["to"])) : vue.createCommentVNode("", true);
     };
   }
 });
@@ -8012,7 +8012,7 @@ async function doMenuAction$2(action, target) {
   }
 }
 const preventKeys$2 = ["Tab", "Up", "Down", "ArrowUp", "ArrowDown", "Home", "End", " ", "Spacebar", "Enter"];
-const _sfc_main$S = vue.defineComponent({
+const _sfc_main$U = vue.defineComponent({
   name: "IPopupMenu",
   components: {
     IPopup
@@ -8267,8 +8267,8 @@ const _sfc_main$S = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$G = ["aria-label"];
-const _hoisted_2$u = {
+const _hoisted_1$I = ["aria-label"];
+const _hoisted_2$v = {
   role: "menu",
   class: "ipopupmenu__list"
 };
@@ -8293,7 +8293,7 @@ function _sfc_render$y(_ctx, _cache, $props, $setup, $data, $options) {
     default: vue.withCtx(() => [vue.createElementVNode("nav", {
       class: "ipopupmenu ipopupmenu--vertical",
       "aria-label": _ctx.ariaLabel
-    }, [vue.createElementVNode("ul", _hoisted_2$u, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item, index) => {
+    }, [vue.createElementVNode("ul", _hoisted_2$v, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item, index) => {
       return vue.openBlock(), vue.createElementBlock("li", {
         ref_for: true,
         ref: "items",
@@ -8310,17 +8310,17 @@ function _sfc_render$y(_ctx, _cache, $props, $setup, $data, $options) {
         target: item.target,
         tabindex: "0"
       }, [_ctx.isSelected(index) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$h, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.selectedMenuItemScreenReaderText) + " ", 1)])) : vue.createCommentVNode("", true), vue.createTextVNode(" " + vue.toDisplayString(item.label), 1)], 8, _hoisted_4$l)], 10, _hoisted_3$p);
-    }), 128))])], 8, _hoisted_1$G)]),
+    }), 128))])], 8, _hoisted_1$I)]),
     _: 1
   }, 8, ["is-open", "anchor", "focus-element", "onKeyup", "onKeydown"]);
 }
-const IPopupMenu = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["render", _sfc_render$y]]);
+const IPopupMenu = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["render", _sfc_render$y]]);
 const ANIMATION_DURATION = 500;
 const NO_CSS_CLASSES = "";
 const CLOSED_CSS_CLASS_OPACITY = "animate-expand animate-expand--opacity";
 const CLOSED_CSS_CLASS = "animate-expand";
 const ANIMATION_CSS_CLASSES = "animate-expand animate-expand--expanded";
-const _sfc_main$R = vue.defineComponent({
+const _sfc_main$T = vue.defineComponent({
   name: "IAnimateExpand",
   props: {
     /**
@@ -8512,7 +8512,7 @@ const _sfc_main$R = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$F = {
+const _hoisted_1$H = {
   key: 0,
   ref: "content",
   "data-test": "animation-content"
@@ -8521,10 +8521,10 @@ function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("div", {
     class: vue.normalizeClass(_ctx.animationClasses),
     style: vue.normalizeStyle(_ctx.heightStyle)
-  }, [_ctx.shouldVIf ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$F, [vue.renderSlot(_ctx.$slots, "default")], 512)), [[vue.vShow, _ctx.shouldVShow]]) : vue.createCommentVNode("", true)], 6);
+  }, [_ctx.shouldVIf ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$H, [vue.renderSlot(_ctx.$slots, "default")], 512)), [[vue.vShow, _ctx.shouldVShow]]) : vue.createCommentVNode("", true)], 6);
 }
-const IAnimateExpand = /* @__PURE__ */ _export_sfc(_sfc_main$R, [["render", _sfc_render$x]]);
-const _sfc_main$Q = vue.defineComponent({
+const IAnimateExpand = /* @__PURE__ */ _export_sfc(_sfc_main$T, [["render", _sfc_render$x]]);
+const _sfc_main$S = vue.defineComponent({
   name: "ISkipLink",
   mixins: [TranslationMixin],
   props: {
@@ -8538,14 +8538,14 @@ const _sfc_main$Q = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$E = ["href"];
+const _hoisted_1$G = ["href"];
 function _sfc_render$w(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("a", {
     class: "iskiplink",
     href: _ctx.href
-  }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.$t("fkui.skip-link.text", "Gå direkt till innehåll")), 1)])], 8, _hoisted_1$E);
+  }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.$t("fkui.skip-link.text", "Gå direkt till innehåll")), 1)])], 8, _hoisted_1$G);
 }
-const ISkipLink = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["render", _sfc_render$w]]);
+const ISkipLink = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["render", _sfc_render$w]]);
 function filterOptions(options, filter2, selectMode) {
   if (logic.isEmpty(filter2) || selectMode) {
     return options;
@@ -8570,10 +8570,10 @@ function useCombobox(inputRef, options, onOptionSelected) {
       }
     };
   }
-  useEventListener(inputRef, "click", onInputClick);
-  useEventListener(inputRef, "focus", onInputFocus);
-  useEventListener(inputRef, "keydown", onInputKeyDown);
-  useEventListener(inputRef, "keyup", onInputKeyUp);
+  useEventListener$1(inputRef, "click", onInputClick);
+  useEventListener$1(inputRef, "focus", onInputFocus);
+  useEventListener$1(inputRef, "keydown", onInputKeyDown);
+  useEventListener$1(inputRef, "keyup", onInputKeyUp);
   const dropdownId = logic.ElementIdService.generateElementId();
   const dropdownIsOpen = vue.ref(false);
   const activeOptionId = logic.ElementIdService.generateElementId();
@@ -8791,12 +8791,12 @@ function useCombobox(inputRef, options, onOptionSelected) {
     }
   }
 }
-const _hoisted_1$D = {
+const _hoisted_1$F = {
   class: "combobox"
 };
-const _hoisted_2$t = ["id"];
+const _hoisted_2$u = ["id"];
 const _hoisted_3$o = ["id", "aria-selected", "onClick"];
-const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
   __name: "IComboboxDropdown",
   props: {
     id: {},
@@ -8833,7 +8833,7 @@ const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$D, [vue.createVNode(vue.unref(_sfc_main$T), {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$F, [vue.createVNode(vue.unref(_sfc_main$V), {
         "is-open": _ctx.isOpen,
         anchor: _ctx.inputNode,
         "num-of-items": _ctx.options.length,
@@ -8858,14 +8858,14 @@ const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
             }]),
             onClick: vue.withModifiers(($event) => onOptionClick(item), ["stop", "prevent"])
           }, vue.toDisplayString(item), 11, _hoisted_3$o);
-        }), 128))], 8, _hoisted_2$t)]),
+        }), 128))], 8, _hoisted_2$u)]),
         _: 1
       }, 8, ["is-open", "anchor", "num-of-items", "active-element"])]);
     };
   }
 });
-const _hoisted_1$C = ["aria-label"];
-const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$E = ["aria-label"];
+const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
   __name: "IComboboxToggleButton",
   emits: ["toggle"],
   setup(__props, {
@@ -8884,7 +8884,7 @@ const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
       }, [vue.createVNode(vue.unref(FIcon), {
         name: "arrow-down",
         class: "text-field__icon"
-      })], 8, _hoisted_1$C);
+      })], 8, _hoisted_1$E);
     };
   }
 });
@@ -8986,7 +8986,7 @@ function useHorizontalOffset(options) {
     }, 0);
   }
 }
-const _sfc_main$N = vue.defineComponent({
+const _sfc_main$P = vue.defineComponent({
   name: "FTooltip",
   components: {
     FExpand,
@@ -9145,8 +9145,8 @@ const _sfc_main$N = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$B = ["aria-expanded"];
-const _hoisted_2$s = {
+const _hoisted_1$D = ["aria-expanded"];
+const _hoisted_2$t = {
   class: "icon-stack icon-stack--tooltip"
 };
 const _hoisted_3$n = {
@@ -9174,11 +9174,11 @@ function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
     type: "button",
     "aria-expanded": _ctx.isOpen,
     onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClickToggle && _ctx.onClickToggle(...args))
-  }, [vue.createElementVNode("span", _hoisted_2$s, [vue.createVNode(_component_f_icon, {
+  }, [vue.createElementVNode("span", _hoisted_2$t, [vue.createVNode(_component_f_icon, {
     name: "circle"
   }), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createVNode(_component_f_icon, {
     name: "i"
-  }), _cache[3] || (_cache[3] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_3$n, vue.toDisplayString(_ctx.screenReaderText), 1)])], 8, _hoisted_1$B)], 8, ["disabled", "to"])), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("div", vue.mergeProps({
+  }), _cache[3] || (_cache[3] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_3$n, vue.toDisplayString(_ctx.screenReaderText), 1)])], 8, _hoisted_1$D)], 8, ["disabled", "to"])), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("div", vue.mergeProps({
     ref: "wrapper",
     class: "tooltip"
   }, _ctx.$attrs), [_ctx.ready ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$k, [_ctx.hasHeader ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.headerTag), {
@@ -9196,7 +9196,7 @@ function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
     name: "close"
   })])])])) : vue.createCommentVNode("", true)], 16)], 64);
 }
-const FTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["render", _sfc_render$v]]);
+const FTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["render", _sfc_render$v]]);
 function* labelClasses(options) {
   const {
     labelClass
@@ -9237,7 +9237,7 @@ function isEqual(a, b) {
   }
   return a.every((_, i) => a[i] === b[i]);
 }
-const _sfc_main$M = vue.defineComponent({
+const _sfc_main$O = vue.defineComponent({
   name: "FFieldset",
   components: {
     FIcon
@@ -9465,8 +9465,8 @@ const _sfc_main$M = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$A = ["id"];
-const _hoisted_2$r = {
+const _hoisted_1$C = ["id"];
+const _hoisted_2$s = {
   key: 0,
   class: "sr-only"
 };
@@ -9506,7 +9506,7 @@ function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
   }, [(vue.openBlock(), vue.createElementBlock("legend", {
     key: _ctx.legendKey,
     class: vue.normalizeClass(["label", _ctx.legendClass])
-  }, [vue.renderSlot(_ctx.$slots, "label"), _cache[1] || (_cache[1] = vue.createTextVNode()), _ctx.hasCheckbox && _ctx.children.length > 1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$r, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.numberOfCheckboxesScreenReaderText), 1)])) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "description", {
+  }, [vue.renderSlot(_ctx.$slots, "label"), _cache[1] || (_cache[1] = vue.createTextVNode()), _ctx.hasCheckbox && _ctx.children.length > 1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$s, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.numberOfCheckboxesScreenReaderText), 1)])) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "description", {
     descriptionClass: _ctx.descriptionClass,
     formatDescriptionClass: _ctx.formatDescriptionClass
   }), _cache[3] || (_cache[3] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "error-message", vue.normalizeProps(vue.guardReactiveProps({
@@ -9532,11 +9532,11 @@ function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
     name: "error"
   }), vue.createTextVNode(" " + vue.toDisplayString(_ctx.validity.validationMessage), 1)])) : vue.createCommentVNode("", true)])], 2)) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("div", {
     class: vue.normalizeClass(_ctx.groupContentClass)
-  }, [vue.renderSlot(_ctx.$slots, "default")], 2)], 42, _hoisted_1$A);
+  }, [vue.renderSlot(_ctx.$slots, "default")], 2)], 42, _hoisted_1$C);
 }
-const FFieldset = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["render", _sfc_render$u]]);
+const FFieldset = /* @__PURE__ */ _export_sfc(_sfc_main$O, [["render", _sfc_render$u]]);
 const anyType$1 = [String, Object, Array, Number, Date, Boolean];
-const _sfc_main$L = vue.defineComponent({
+const _sfc_main$N = vue.defineComponent({
   name: "FCheckboxField",
   inheritAttrs: false,
   props: {
@@ -9722,8 +9722,8 @@ const _sfc_main$L = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$z = ["id", "disabled"];
-const _hoisted_2$q = ["for"];
+const _hoisted_1$B = ["id", "disabled"];
+const _hoisted_2$r = ["for"];
 const _hoisted_3$l = {
   key: 0,
   class: "checkbox__details"
@@ -9745,7 +9745,7 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
     disabled: _ctx.disabled,
     onKeydown: _cache[0] || (_cache[0] = vue.withKeys((...args) => _ctx.onKeydown && _ctx.onKeydown(...args), ["space"])),
     onChange: _cache[1] || (_cache[1] = ($event) => _ctx.updateExpandedFlag())
-  }), null, 16, _hoisted_1$z), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("label", {
+  }), null, 16, _hoisted_1$B), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("label", {
     class: vue.normalizeClass(_ctx.$slots.details ? "checkbox__label checkbox__width" : "checkbox__label"),
     for: _ctx.id
   }, [vue.renderSlot(_ctx.$slots, "default"), _cache[8] || (_cache[8] = vue.createTextVNode()), _ctx.$slots.details ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
@@ -9760,9 +9760,9 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
       height: _ctx.height
     })])) : vue.createCommentVNode("", true)]),
     _: 3
-  }, 8, ["onEnter", "onAfterEnter", "onLeave"])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)], 10, _hoisted_2$q)], 34);
+  }, 8, ["onEnter", "onAfterEnter", "onLeave"])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)], 10, _hoisted_2$r)], 34);
 }
-const FCheckboxField = /* @__PURE__ */ _export_sfc(_sfc_main$L, [["render", _sfc_render$t]]);
+const FCheckboxField = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["render", _sfc_render$t]]);
 var es_iterator_some = {};
 var hasRequiredEs_iterator_some;
 function requireEs_iterator_some() {
@@ -9841,7 +9841,7 @@ async function doMenuAction$1(action, target) {
 }
 const preventKeys$1 = ["Tab", "Up", "Down", "ArrowUp", "ArrowDown", "Home", "End", " ", "Spacebar", "Enter", "Escape"];
 const keyUp = ["ArrowUp", "Up"];
-const _sfc_main$K = vue.defineComponent({
+const _sfc_main$M = vue.defineComponent({
   name: "FContextMenu",
   components: {
     IPopup,
@@ -10005,8 +10005,8 @@ const _sfc_main$K = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$y = ["aria-label"];
-const _hoisted_2$p = {
+const _hoisted_1$A = ["aria-label"];
+const _hoisted_2$q = {
   ref: "contextmenu",
   role: "menu",
   tabindex: "-1",
@@ -10035,7 +10035,7 @@ function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
       "aria-label": _ctx.ariaLabel,
       onKeyup: _cache[0] || (_cache[0] = (...args) => _ctx.onKeyUp && _ctx.onKeyUp(...args)),
       onKeydown: _cache[1] || (_cache[1] = (...args) => _ctx.onKeyDown && _ctx.onKeyDown(...args))
-    }, [vue.createElementVNode("ul", _hoisted_2$p, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.popupItems, (item, index) => {
+    }, [vue.createElementVNode("ul", _hoisted_2$q, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.popupItems, (item, index) => {
       return vue.openBlock(), vue.createElementBlock("li", {
         key: item.key,
         role: "menuitem",
@@ -10054,11 +10054,11 @@ function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
         ref_for: true,
         ref: "anchors"
       }, vue.toDisplayString(item.label), 513)], 8, _hoisted_4$h), _cache[4] || (_cache[4] = vue.createTextVNode()), _ctx.hasSeparatorAfterItemAt(index) ? (vue.openBlock(), vue.createElementBlock("hr", _hoisted_5$e)) : vue.createCommentVNode("", true)], 8, _hoisted_3$k);
-    }), 128))], 512)], 40, _hoisted_1$y)]),
+    }), 128))], 512)], 40, _hoisted_1$A)]),
     _: 1
   }, 8, ["is-open", "anchor", "focus-element"]);
 }
-const FContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$K, [["render", _sfc_render$s]]);
+const FContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["render", _sfc_render$s]]);
 var Operation = /* @__PURE__ */ ((Operation2) => {
   Operation2[Operation2["ADD"] = 0] = "ADD";
   Operation2[Operation2["DELETE"] = 1] = "DELETE";
@@ -10066,13 +10066,13 @@ var Operation = /* @__PURE__ */ ((Operation2) => {
   Operation2[Operation2["NONE"] = 3] = "NONE";
   return Operation2;
 })(Operation || {});
-const _hoisted_1$x = {
+const _hoisted_1$z = {
   class: "crud-dataset"
 };
-const _hoisted_2$o = {
+const _hoisted_2$p = {
   key: 0
 };
-const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
   __name: "FCrudDataset",
   props: {
     /**
@@ -10302,7 +10302,7 @@ const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
       isFormModalOpen.value = true;
     }
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$x, [vue.renderSlot(_ctx.$slots, "default"), _cache[5] || (_cache[5] = vue.createTextVNode()), hasAddSlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$o, [vue.createElementVNode("button", {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$z, [vue.renderSlot(_ctx.$slots, "default"), _cache[5] || (_cache[5] = vue.createTextVNode()), hasAddSlot.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$p, [vue.createElementVNode("button", {
         "data-test": "f-crud-dataset-add-button",
         type: "button",
         class: "button button--tertiary crud-dataset__add-button",
@@ -10354,7 +10354,7 @@ function FCrudDatasetInjected() {
     modify: vue.inject("modify")
   };
 }
-const _sfc_main$I = vue.defineComponent({
+const _sfc_main$K = vue.defineComponent({
   name: "FCrudButton",
   components: {
     FIcon
@@ -10410,7 +10410,7 @@ const _sfc_main$I = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$w = {
+const _hoisted_1$y = {
   key: 1,
   class: "sr-only"
 };
@@ -10424,11 +10424,11 @@ function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
     key: 0,
     class: "button__icon",
     name: _ctx.iconName
-  }, null, 8, ["name"])) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), !_ctx.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$w, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.buttonText), 1)])])) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), _ctx.label ? vue.renderSlot(_ctx.$slots, "default", {
+  }, null, 8, ["name"])) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), !_ctx.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$y, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.buttonText), 1)])])) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), _ctx.label ? vue.renderSlot(_ctx.$slots, "default", {
     key: 2
   }, () => [vue.createTextVNode(vue.toDisplayString(_ctx.buttonText), 1)]) : vue.createCommentVNode("", true)]);
 }
-const FCrudButton = /* @__PURE__ */ _export_sfc(_sfc_main$I, [["render", _sfc_render$r]]);
+const FCrudButton = /* @__PURE__ */ _export_sfc(_sfc_main$K, [["render", _sfc_render$r]]);
 function ActivateItemInjected() {
   return {
     registerCallbackAfterItemAdd: vue.inject("registerCallbackAfterItemAdd", () => void 0),
@@ -10512,7 +10512,7 @@ function FTableInjected() {
     renderColumns: vue.inject("renderColumns", false)
   };
 }
-const _sfc_main$H = vue.defineComponent({
+const _sfc_main$J = vue.defineComponent({
   name: "FTableColumn",
   inheritAttrs: false,
   props: {
@@ -10665,7 +10665,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 16, ["class", "scope"])) : vue.createCommentVNode("", true);
 }
-const FTableColumn = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$q]]);
+const FTableColumn = /* @__PURE__ */ _export_sfc(_sfc_main$J, [["render", _sfc_render$q]]);
 function FSortFilterDatasetInjected() {
   return {
     sort: vue.inject("sort", () => void 0),
@@ -10673,7 +10673,7 @@ function FSortFilterDatasetInjected() {
     registerCallbackOnMount: vue.inject("registerCallbackOnMount", () => void 0)
   };
 }
-const _sfc_main$G = vue.defineComponent({
+const _sfc_main$I = vue.defineComponent({
   name: "FLabel",
   components: {
     FIcon
@@ -10712,10 +10712,10 @@ const _sfc_main$G = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$v = {
+const _hoisted_1$x = {
   key: 0
 };
-const _hoisted_2$n = {
+const _hoisted_2$o = {
   key: 0,
   ref: "tooltipAttachTo"
 };
@@ -10732,7 +10732,7 @@ const _hoisted_7$a = {
 };
 function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return _ctx.$slots.tooltip ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$v, [_ctx.hasDefaultSlot ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$n, [vue.createElementVNode("label", {
+  return _ctx.$slots.tooltip ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$x, [_ctx.hasDefaultSlot ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$o, [vue.createElementVNode("label", {
     class: "label",
     for: _ctx.forProperty
   }, [vue.renderSlot(_ctx.$slots, "default")], 8, _hoisted_3$j)], 512)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "tooltip"), _cache[3] || (_cache[3] = vue.createTextVNode()), _ctx.hasDescriptionSlot || _ctx.hasErrorMessageSlot ? (vue.openBlock(), vue.createElementBlock("label", {
@@ -10757,11 +10757,11 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
     name: "error"
   }), _cache[4] || (_cache[4] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "error-message")])) : vue.createCommentVNode("", true)], 8, _hoisted_6$b));
 }
-const FLabel = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$p]]);
+const FLabel = /* @__PURE__ */ _export_sfc(_sfc_main$I, [["render", _sfc_render$p]]);
 function resolveWidthClass$1(words, inline) {
   return inline ? void 0 : words.split(" ").map((word) => `i-width-${word}`).join(" ");
 }
-const _sfc_main$F = vue.defineComponent({
+const _sfc_main$H = vue.defineComponent({
   name: "FSelectField",
   components: {
     FIcon,
@@ -10892,7 +10892,7 @@ const _sfc_main$F = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$u = ["id"];
+const _hoisted_1$w = ["id"];
 function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_label = vue.resolveComponent("f-label");
   const _component_f_icon = vue.resolveComponent("f-icon");
@@ -10930,7 +10930,7 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
     id: _ctx.id,
     "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.vModel = $event),
     class: "select-field__select"
-  }, _ctx.attrs), [vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$u), [[vue.vModelSelect, _ctx.vModel]]), _cache[5] || (_cache[5] = vue.createTextVNode()), _ctx.hasError && _ctx.textFieldTableMode ? (vue.openBlock(), vue.createBlock(_component_f_icon, {
+  }, _ctx.attrs), [vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$w), [[vue.vModelSelect, _ctx.vModel]]), _cache[5] || (_cache[5] = vue.createTextVNode()), _ctx.hasError && _ctx.textFieldTableMode ? (vue.openBlock(), vue.createBlock(_component_f_icon, {
     key: 0,
     ref: "icon",
     class: "text-field__icon input-icon select-field__error-popup-icon",
@@ -10940,7 +10940,7 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
     name: "arrow-down"
   })], 2)], 34);
 }
-const FSelectField = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["render", _sfc_render$o]]);
+const FSelectField = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$o]]);
 function resolveWidthClass(words, inline) {
   return inline ? void 0 : words.split(" ").map((word) => `i-width-${word}`).join(" ");
 }
@@ -10984,14 +10984,14 @@ function useTextFieldSetup(props) {
     closeDropdown
   };
 }
-const _sfc_main$E = vue.defineComponent({
+const _sfc_main$G = vue.defineComponent({
   name: "FTextField",
   components: {
     FLabel,
     FIcon,
     IPopupError,
-    IComboboxDropdown: _sfc_main$P,
-    IComboboxToggleButton: _sfc_main$O
+    IComboboxDropdown: _sfc_main$R,
+    IComboboxToggleButton: _sfc_main$Q
   },
   inheritAttrs: false,
   props: {
@@ -11015,11 +11015,12 @@ const _sfc_main$E = vue.defineComponent({
     },
     /**
      * The value for the input.
-     * If the prop is not set undefined will be used.
+     * If the prop is not used or set to undefined
+     * or null then the default value will be used.
      * @model
      */
     modelValue: {
-      type: [String, Number],
+      type: [String, Number, null],
       required: false,
       default: ""
     },
@@ -11322,10 +11323,10 @@ const _sfc_main$E = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$t = {
+const _hoisted_1$v = {
   key: 0
 };
-const _hoisted_2$m = {
+const _hoisted_2$n = {
   key: 0,
   class: "sr-only"
 };
@@ -11359,7 +11360,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
     for: _ctx.id,
     class: vue.normalizeClass(_ctx.labelClass)
   }, vue.createSlots({
-    default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default", {}, () => [_ctx.defaultText !== "" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$t, vue.toDisplayString(_ctx.defaultText), 1)) : vue.createCommentVNode("", true)])]),
+    default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default", {}, () => [_ctx.defaultText !== "" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$v, vue.toDisplayString(_ctx.defaultText), 1)) : vue.createCommentVNode("", true)])]),
     description: vue.withCtx(({
       descriptionClass,
       formatDescriptionClass
@@ -11369,7 +11370,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
     }, () => [_ctx.descriptionText ? (vue.openBlock(), vue.createElementBlock("span", {
       key: 0,
       class: vue.normalizeClass(descriptionClass)
-    }, [_ctx.descriptionScreenReaderText ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$m, vue.toDisplayString(_ctx.descriptionScreenReaderText), 1)) : vue.createCommentVNode("", true), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("span", null, vue.toDisplayString(_ctx.descriptionText), 1)], 2)) : vue.createCommentVNode("", true), _cache[9] || (_cache[9] = vue.createTextVNode()), _ctx.discreteDescriptionText ? (vue.openBlock(), vue.createElementBlock("span", {
+    }, [_ctx.descriptionScreenReaderText ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$n, vue.toDisplayString(_ctx.descriptionScreenReaderText), 1)) : vue.createCommentVNode("", true), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("span", null, vue.toDisplayString(_ctx.descriptionText), 1)], 2)) : vue.createCommentVNode("", true), _cache[9] || (_cache[9] = vue.createTextVNode()), _ctx.discreteDescriptionText ? (vue.openBlock(), vue.createElementBlock("span", {
       key: 1,
       class: vue.normalizeClass(formatDescriptionClass)
     }, [_ctx.discreteDescriptionScreenReaderText ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$i, vue.toDisplayString(_ctx.discreteDescriptionScreenReaderText), 1)) : vue.createCommentVNode("", true), _cache[8] || (_cache[8] = vue.createTextVNode()), vue.createElementVNode("span", null, vue.toDisplayString(_ctx.discreteDescriptionText), 1)], 2)) : vue.createCommentVNode("", true)])]),
@@ -11428,8 +11429,8 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
     onClose: _ctx.onDropdownClose
   }, null, 8, ["id", "is-open", "options", "active-option", "active-option-id", "input-node", "onSelect", "onClose"])) : vue.createCommentVNode("", true)], 2);
 }
-const FTextField = /* @__PURE__ */ _export_sfc(_sfc_main$E, [["render", _sfc_render$n]]);
-const _sfc_main$D = vue.defineComponent({
+const FTextField = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$n]]);
+const _sfc_main$F = vue.defineComponent({
   name: "FEmailTextField",
   components: {
     FTextField
@@ -11453,7 +11454,7 @@ const _sfc_main$D = vue.defineComponent({
      * @model
      */
     modelValue: {
-      type: String,
+      type: [String, null],
       required: false,
       default: void 0
     },
@@ -11545,7 +11546,7 @@ const _sfc_main$D = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$s = {
+const _hoisted_1$u = {
   key: 0
 };
 function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
@@ -11562,7 +11563,7 @@ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
     onValidity: _ctx.onValidity,
     onPendingValidity: _ctx.onPendingValidity
   }), {
-    "error-message": vue.withCtx(() => [_ctx.showPasteErrorMessage ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$s, vue.toDisplayString(_ctx.pasteErrorText), 1)) : vue.createCommentVNode("", true)]),
+    "error-message": vue.withCtx(() => [_ctx.showPasteErrorMessage ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$u, vue.toDisplayString(_ctx.pasteErrorText), 1)) : vue.createCommentVNode("", true)]),
     default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.defaultText), 1)]), _cache[2] || (_cache[2] = vue.createTextVNode())]),
     _: 3
   }, 16, ["id", "maxlength", "model-value", "onChange", "onBlur", "onUpdate:modelValue", "onValidity", "onPendingValidity"]), _cache[3] || (_cache[3] = vue.createTextVNode()), _ctx.extendedValidation ? (vue.openBlock(), vue.createBlock(_component_f_text_field, {
@@ -11578,8 +11579,8 @@ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["modelValue", "maxlength", "onPaste"])) : vue.createCommentVNode("", true)]);
 }
-const FEmailTextField = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["render", _sfc_render$m]]);
-const _sfc_main$C = vue.defineComponent({
+const FEmailTextField = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["render", _sfc_render$m]]);
+const _sfc_main$E = vue.defineComponent({
   name: "FPhoneTextField",
   components: {
     FTextField
@@ -11599,11 +11600,12 @@ const _sfc_main$C = vue.defineComponent({
     },
     /**
      * The value for the input.
-     * If the prop is not set undefined will be used.
+     * If the prop is not used or set to undefined
+     * or null then the default value will be used.
      * @model
      */
     modelValue: {
-      type: String,
+      type: [String, null],
       required: false,
       default: void 0
     },
@@ -11706,8 +11708,8 @@ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["modelValue", "maxlength"])) : vue.createCommentVNode("", true)]);
 }
-const FPhoneTextField = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["render", _sfc_render$l]]);
-const _sfc_main$B = vue.defineComponent({
+const FPhoneTextField = /* @__PURE__ */ _export_sfc(_sfc_main$E, [["render", _sfc_render$l]]);
+const _sfc_main$D = vue.defineComponent({
   name: "FCurrencyTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -11742,7 +11744,7 @@ const _sfc_main$B = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$A = vue.defineComponent({
+const _sfc_main$C = vue.defineComponent({
   name: "FSearchTextField",
   components: {
     FTextField,
@@ -11755,7 +11757,7 @@ const _sfc_main$A = vue.defineComponent({
       default: () => logic.ElementIdService.generateElementId()
     },
     modelValue: {
-      type: String,
+      type: [String, null],
       required: false,
       default: ""
     },
@@ -11777,7 +11779,8 @@ const _sfc_main$A = vue.defineComponent({
   },
   computed: {
     canClear() {
-      return this.modelValue !== "";
+      const isEmpty = this.modelValue === void 0 || this.modelValue === null || this.modelValue === "";
+      return !isEmpty;
     }
   },
   methods: {
@@ -11802,7 +11805,7 @@ const _sfc_main$A = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$r = {
+const _hoisted_1$t = {
   class: "sr-only"
 };
 function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
@@ -11851,12 +11854,12 @@ function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
     }, [vue.createVNode(_component_f_icon, {
       name: "cross",
       class: "clear-button__icon"
-    }), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_1$r, vue.toDisplayString(_ctx.clearableScreenReaderText), 1)])]),
+    }), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_1$t, vue.toDisplayString(_ctx.clearableScreenReaderText), 1)])]),
     key: "1"
   } : void 0]), 1040, ["id", "maxlength", "model-value", "onChange", "onInput", "onBlur", "onUpdate"])]);
 }
-const FSearchTextField = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["render", _sfc_render$k]]);
-const _sfc_main$z = vue.defineComponent({
+const FSearchTextField = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["render", _sfc_render$k]]);
+const _sfc_main$B = vue.defineComponent({
   name: "FBankAccountNumberTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -11885,7 +11888,7 @@ const _sfc_main$z = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$y = vue.defineComponent({
+const _sfc_main$A = vue.defineComponent({
   name: "FBankgiroTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -11917,7 +11920,7 @@ const _sfc_main$y = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$x = vue.defineComponent({
+const _sfc_main$z = vue.defineComponent({
   name: "FClearingnumberTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -11949,7 +11952,7 @@ const _sfc_main$x = vue.defineComponent({
 function defaultFormatter$1(modelValue) {
   return logic.formatNumber(modelValue, this.decimals);
 }
-const _sfc_main$w = vue.defineComponent({
+const _sfc_main$y = vue.defineComponent({
   name: "FNumericTextField",
   extends: FTextField,
   props: {
@@ -11986,7 +11989,7 @@ const _sfc_main$w = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$v = vue.defineComponent({
+const _sfc_main$x = vue.defineComponent({
   name: "FPersonnummerTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -12026,7 +12029,7 @@ const _sfc_main$v = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$u = vue.defineComponent({
+const _sfc_main$w = vue.defineComponent({
   name: "FPlusgiroTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -12058,7 +12061,7 @@ const _sfc_main$u = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$t = vue.defineComponent({
+const _sfc_main$v = vue.defineComponent({
   name: "FPostalCodeTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -12095,7 +12098,7 @@ const _sfc_main$t = vue.defineComponent({
 function defaultFormatter(modelValue) {
   return logic.formatPercent(modelValue, this.decimals);
 }
-const _sfc_main$s = vue.defineComponent({
+const _sfc_main$u = vue.defineComponent({
   name: "FPercentTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -12143,7 +12146,7 @@ const _sfc_main$s = vue.defineComponent({
     logic.ValidationService.validateElement(inputElement);
   }
 });
-const _sfc_main$r = vue.defineComponent({
+const _sfc_main$t = vue.defineComponent({
   name: "FOrganisationsnummerTextField",
   extends: FTextField,
   mixins: [TranslationMixin],
@@ -12251,10 +12254,10 @@ function filter(list, filterAttributes, searchString) {
   const searchTerms = searchString.split(/\s+/).map((word) => word.toLocaleLowerCase());
   return list.filter((item) => includesAllSearchTerms(item, filterAttributes, searchTerms));
 }
-const _hoisted_1$q = {
+const _hoisted_1$s = {
   class: "sort-filter-dataset"
 };
-const _hoisted_2$l = {
+const _hoisted_2$m = {
   class: "sort-filter-dataset__search"
 };
 const _hoisted_3$h = {
@@ -12271,7 +12274,7 @@ const _hoisted_6$9 = {
   }
 };
 const _hoisted_7$8 = ["value"];
-const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
   __name: "FSortFilterDataset",
   props: {
     /**
@@ -12457,7 +12460,7 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
       }
     }
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [vue.createVNode(vue.unref(IFlex), {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [vue.createVNode(vue.unref(IFlex), {
         collapse: "",
         gap: "3x",
         wrap: ""
@@ -12482,7 +12485,7 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
               shrink: "",
               align: "center"
             }, {
-              default: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_2$l, [vue.createVNode(vue.unref(FIcon), {
+              default: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_2$m, [vue.createVNode(vue.unref(FIcon), {
                 name: "search",
                 class: "sort-filter-dataset__search__magnify-icon"
               }), _cache[3] || (_cache[3] = vue.createTextVNode()), vue.createVNode(vue.unref(FTextField), {
@@ -12540,8 +12543,8 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$p = ["tabindex"];
-const _hoisted_2$k = {
+const _hoisted_1$r = ["tabindex"];
+const _hoisted_2$l = {
   key: 0
 };
 const _hoisted_3$g = {
@@ -12559,7 +12562,7 @@ const _hoisted_7$7 = {
   key: 1
 };
 const _hoisted_8$5 = ["colspan"];
-const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
   ...{
     inheritAttrs: false
   },
@@ -12705,7 +12708,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
       }, [vue.createElementVNode("table", vue.mergeProps({
         class: ["table", tableClasses.value],
         tabindex: tabindex.value
-      }, _ctx.$attrs), [hasCaption.value ? (vue.openBlock(), vue.createElementBlock("caption", _hoisted_2$k, [vue.renderSlot(_ctx.$slots, "caption")])) : vue.createCommentVNode("", true), _cache[4] || (_cache[4] = vue.createTextVNode()), vue.createElementVNode("colgroup", null, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(columns.value, (column) => {
+      }, _ctx.$attrs), [hasCaption.value ? (vue.openBlock(), vue.createElementBlock("caption", _hoisted_2$l, [vue.renderSlot(_ctx.$slots, "caption")])) : vue.createCommentVNode("", true), _cache[4] || (_cache[4] = vue.createTextVNode()), vue.createElementVNode("colgroup", null, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(columns.value, (column) => {
         return vue.openBlock(), vue.createElementBlock("col", {
           key: column.id,
           class: vue.normalizeClass(column.size)
@@ -12738,7 +12741,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
         }, {
           row
         }))]);
-      }), 128))])], 16, _hoisted_1$p)], 2);
+      }), 128))])], 16, _hoisted_1$r)], 2);
     };
   }
 });
@@ -12817,7 +12820,7 @@ function getDisplayMonth(minDate, maxDate, selectedDate, initialMonth) {
   }
   return month || date.FDate.now().startOfMonth();
 }
-const _sfc_main$o = vue.defineComponent({
+const _sfc_main$q = vue.defineComponent({
   name: "FDatepickerField",
   components: {
     FCalendar,
@@ -13075,11 +13078,11 @@ const _sfc_main$o = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$o = {
+const _hoisted_1$q = {
   ref: "component",
   class: "datepicker-field"
 };
-const _hoisted_2$j = ["disabled", "aria-expanded"];
+const _hoisted_2$k = ["disabled", "aria-expanded"];
 const _hoisted_3$f = {
   class: "sr-only"
 };
@@ -13092,7 +13095,7 @@ function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_calendar_day = vue.resolveComponent("f-calendar-day");
   const _component_f_calendar = vue.resolveComponent("f-calendar");
   const _component_i_popup = vue.resolveComponent("i-popup");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [vue.createElementVNode("div", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [vue.createElementVNode("div", {
     ref: "calendarInputs",
     onFocusout: _cache[2] || (_cache[2] = (...args) => _ctx.onFocusoutTextFieldButton && _ctx.onFocusoutTextFieldButton(...args))
   }, [vue.createVNode(_component_f_text_field, vue.mergeProps(_ctx.$attrs, {
@@ -13131,7 +13134,7 @@ function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
       onClick: _cache[0] || (_cache[0] = ($event) => _ctx.onClickCalendarButton())
     }, [vue.createVNode(_component_f_icon, {
       name: "calendar"
-    }), _cache[6] || (_cache[6] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_3$f, vue.toDisplayString(_ctx.calendarButtonText), 1)], 8, _hoisted_2$j)]),
+    }), _cache[6] || (_cache[6] = vue.createTextVNode()), vue.createElementVNode("span", _hoisted_3$f, vue.toDisplayString(_ctx.calendarButtonText), 1)], 8, _hoisted_2$k)]),
     default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.$t("fkui.datepicker-field.label", "Datum")), 1)]), _cache[7] || (_cache[7] = vue.createTextVNode()), _cache[8] || (_cache[8] = vue.createTextVNode()), _cache[9] || (_cache[9] = vue.createTextVNode()), _cache[10] || (_cache[10] = vue.createTextVNode())]),
     _: 2
   }, [_ctx.$slots.tooltip ? {
@@ -13182,11 +13185,11 @@ function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["is-open", "anchor", "inline", "onOpen", "onClose"])], 512);
 }
-const FDatepickerField = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$j]]);
+const FDatepickerField = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$j]]);
 function isDialogueTreeEndQuestion(value) {
   return Boolean(value.userData);
 }
-const _sfc_main$n = vue.defineComponent({
+const _sfc_main$p = vue.defineComponent({
   name: "FDialogueTree",
   components: {
     FIcon
@@ -13264,17 +13267,17 @@ const _sfc_main$n = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$n = {
+const _hoisted_1$p = {
   class: "dialogue-tree"
 };
-const _hoisted_2$i = {
+const _hoisted_2$j = {
   key: 0,
   class: "dialogue-tree__list"
 };
 const _hoisted_3$e = ["onClick"];
 function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [_ctx.options.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_2$i, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (option, index) => {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [_ctx.options.length > 0 ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_2$j, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (option, index) => {
     return vue.openBlock(), vue.createElementBlock("li", {
       key: option.label,
       class: "dialogue-tree__list-item"
@@ -13292,8 +13295,8 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
     userData: _ctx.userData
   })))]);
 }
-const FDialogueTree = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["render", _sfc_render$i]]);
-const _sfc_main$m = vue.defineComponent({
+const FDialogueTree = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$i]]);
+const _sfc_main$o = vue.defineComponent({
   name: "FExpandablePanel",
   components: {
     FIcon,
@@ -13367,8 +13370,8 @@ const _sfc_main$m = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$m = ["aria-expanded", "aria-controls"];
-const _hoisted_2$h = {
+const _hoisted_1$o = ["aria-expanded", "aria-controls"];
+const _hoisted_2$i = {
   class: "expandable-panel__icon"
 };
 const _hoisted_3$d = {
@@ -13400,7 +13403,7 @@ function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
       "aria-controls": _ctx.id
     }, _ctx.$attrs, {
       onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClickHeadingButton && _ctx.onClickHeadingButton(...args))
-    }), [vue.createElementVNode("span", _hoisted_2$h, [vue.createElementVNode("span", _hoisted_3$d, [vue.createVNode(_component_f_icon, {
+    }), [vue.createElementVNode("span", _hoisted_2$i, [vue.createElementVNode("span", _hoisted_3$d, [vue.createVNode(_component_f_icon, {
       name: "dash"
     }), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createVNode(_component_f_icon, {
       name: "dash"
@@ -13413,7 +13416,7 @@ function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
       })
     }, [vue.createElementVNode("span", _hoisted_5$9, vue.toDisplayString(_ctx.screenReaderNotificationText), 1), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createVNode(_component_f_icon, {
       name: "bell"
-    })], 8, _hoisted_4$b)) : vue.createCommentVNode("", true)], 16, _hoisted_1$m)]),
+    })], 8, _hoisted_4$b)) : vue.createCommentVNode("", true)], 16, _hoisted_1$o)]),
     _: 3
   })), _cache[6] || (_cache[6] = vue.createTextVNode()), vue.createVNode(_component_f_expand, null, {
     default: vue.withCtx(() => [vue.withDirectives(vue.createElementVNode("div", {
@@ -13423,8 +13426,8 @@ function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   })], 2);
 }
-const FExpandablePanel = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["render", _sfc_render$h]]);
-const _sfc_main$l = vue.defineComponent({
+const FExpandablePanel = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$h]]);
+const _sfc_main$n = vue.defineComponent({
   name: "FExpandableParagraph",
   components: {
     FIcon,
@@ -13506,8 +13509,8 @@ const _sfc_main$l = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$l = ["aria-expanded", "aria-controls"];
-const _hoisted_2$g = {
+const _hoisted_1$n = ["aria-expanded", "aria-controls"];
+const _hoisted_2$h = {
   class: "expandable-paragraph__icon"
 };
 const _hoisted_3$c = {
@@ -13542,11 +13545,11 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
       "aria-controls": _ctx.id
     }, _ctx.$attrs, {
       onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClickMinimize && _ctx.onClickMinimize(...args))
-    }), [vue.createElementVNode("span", _hoisted_2$g, [vue.createElementVNode("span", _hoisted_3$c, [vue.createVNode(_component_f_icon, {
+    }), [vue.createElementVNode("span", _hoisted_2$h, [vue.createElementVNode("span", _hoisted_3$c, [vue.createVNode(_component_f_icon, {
       name: "dash"
     }), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createVNode(_component_f_icon, {
       name: "dash"
-    })])]), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "title")], 16, _hoisted_1$l)]),
+    })])]), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "title")], 16, _hoisted_1$n)]),
     _: 3
   }, 8, ["class"])), _cache[3] || (_cache[3] = vue.createTextVNode()), _ctx.hasRelatedSlot ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$a, [vue.renderSlot(_ctx.$slots, "related")])) : vue.createCommentVNode("", true)], 2), _cache[5] || (_cache[5] = vue.createTextVNode()), vue.createVNode(_component_f_expand, null, {
     default: vue.withCtx(() => [vue.withDirectives(vue.createElementVNode("div", {
@@ -13556,7 +13559,7 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   })], 2);
 }
-const FExpandableParagraph = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$g]]);
+const FExpandableParagraph = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["render", _sfc_render$g]]);
 const DEFAULT_ICON = "file";
 const iconMap = {
   "image/*": "pic",
@@ -13565,7 +13568,7 @@ const iconMap = {
   "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "doc",
   "application/vnd.openxmlformats-officedocument.wordprocessingml.template": "doc"
 };
-const _sfc_main$k = vue.defineComponent({
+const _sfc_main$m = vue.defineComponent({
   name: "FFileItem",
   components: {
     FIcon
@@ -13644,10 +13647,10 @@ const _sfc_main$k = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$k = {
+const _hoisted_1$m = {
   class: "file-item"
 };
-const _hoisted_2$f = {
+const _hoisted_2$g = {
   class: "file-item__row"
 };
 const _hoisted_3$b = ["id"];
@@ -13666,7 +13669,7 @@ const _hoisted_7$4 = {
 };
 function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$k, [vue.createElementVNode("div", _hoisted_2$f, [vue.createElementVNode("a", vue.mergeProps({
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [vue.createElementVNode("div", _hoisted_2$g, [vue.createElementVNode("a", vue.mergeProps({
     id: _ctx.id,
     class: "file-item__file-open"
   }, _ctx.$attrs), [vue.createElementVNode("div", _hoisted_4$9, [vue.createVNode(_component_f_icon, {
@@ -13677,8 +13680,8 @@ function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
     class: "file-item__separator"
   }, null, -1))]);
 }
-const FFileItem = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$f]]);
-const _sfc_main$j = vue.defineComponent({
+const FFileItem = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["render", _sfc_render$f]]);
+const _sfc_main$l = vue.defineComponent({
   name: "FFileSelector",
   components: {
     FIcon
@@ -13739,14 +13742,14 @@ const _sfc_main$j = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$j = {
+const _hoisted_1$l = {
   class: "file-selector"
 };
-const _hoisted_2$e = ["id", "aria-labelledby", "aria-disabled"];
+const _hoisted_2$f = ["id", "aria-labelledby", "aria-disabled"];
 const _hoisted_3$a = ["id", "for"];
 function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [vue.createElementVNode("input", vue.mergeProps({
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [vue.createElementVNode("input", vue.mergeProps({
     id: _ctx.id,
     ref: "file-selector",
     type: "file",
@@ -13754,7 +13757,7 @@ function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
     "aria-disabled": _ctx.ariaDisabled ? "true" : void 0
   }, _ctx.attrs, {
     onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClick && _ctx.onClick(...args))
-  }), null, 16, _hoisted_2$e), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createElementVNode("label", {
+  }), null, 16, _hoisted_2$f), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createElementVNode("label", {
     id: _ctx.labelId,
     role: "button",
     class: vue.normalizeClass([_ctx.labelClass, "button button--tertiary button--medium"]),
@@ -13765,7 +13768,7 @@ function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
     name: "paper-clip"
   }), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "default")], 10, _hoisted_3$a)]);
 }
-const FFileSelector = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$e]]);
+const FFileSelector = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$e]]);
 const keybindings = {
   Up: focusTrAbove,
   Down: focusTrBelow,
@@ -13851,11 +13854,14 @@ function useExpandableTable(expandableAttribute, keyAttribute, describedby, emit
   }
   function expandableRows(row) {
     const expandableRows2 = row[expandableAttribute];
-    if (typeof expandableRows2 === "undefined") {
+    if (expandableRows2 === void 0 || expandableRows2 === null) {
       return void 0;
     }
     if (!Array.isArray(expandableRows2)) {
-      throw new Error(`Expandable rows must be a ListArray`);
+      throw new Error(`Expandable rows must be an array`);
+    }
+    if (expandableRows2.length === 0) {
+      return void 0;
     }
     return expandableRows2;
   }
@@ -13874,8 +13880,8 @@ function useExpandableTable(expandableAttribute, keyAttribute, describedby, emit
     hasExpandableContent
   };
 }
-const _hoisted_1$i = ["role"];
-const _hoisted_2$d = {
+const _hoisted_1$k = ["role"];
+const _hoisted_2$e = {
   key: 0
 };
 const _hoisted_3$9 = {
@@ -13903,7 +13909,7 @@ const _hoisted_8$3 = {
 const _hoisted_9$3 = {
   class: "sr-only"
 };
-const _hoisted_10$2 = ["innerHTML"];
+const _hoisted_10$1 = ["innerHTML"];
 const _hoisted_11$1 = {
   key: 1,
   class: "table__column__description"
@@ -13939,7 +13945,7 @@ const _hoisted_21 = {
   key: 1
 };
 const _hoisted_22 = ["colspan"];
-const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
   ...{
     inheritAttrs: false
   },
@@ -14128,13 +14134,7 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
     });
     vue.provide("textFieldTableMode", true);
     vue.provide("renderColumns", vue.computed(() => props.rows.length > 0));
-    vue.watch(() => props.rows, () => {
-      if (props.modelValue) {
-        selectedRows.value = props.modelValue.filter((row) => {
-          return includeItem(row, props.rows, props.keyAttribute);
-        });
-      }
-    }, {
+    vue.watch(() => props.rows, () => setSelectedRows(), {
       immediate: true,
       deep: true
     });
@@ -14150,6 +14150,10 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
     }, {
       immediate: true
     });
+    vue.watch(() => props.modelValue, () => setSelectedRows(), {
+      immediate: true,
+      deep: true
+    });
     function updateTr(tbodyElement) {
       const trElements = [].slice.call(tbodyElement.children);
       const trInteractableElements = trElements.filter((tr2) => {
@@ -14239,6 +14243,15 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
       updateVModelWithSelectedRows();
       (_b = (_a = vue.getCurrentInstance()) == null ? void 0 : _a.proxy) == null ? void 0 : _b.$forceUpdate();
     }
+    function setSelectedRows() {
+      if (!props.modelValue || !props.modelValue.length) {
+        selectedRows.value = [];
+        return;
+      }
+      selectedRows.value = props.modelValue.filter((row) => {
+        return includeItem(row, props.rows, props.keyAttribute);
+      });
+    }
     function updateVModelWithSelectedRows() {
       if (props.modelValue) {
         emit("update:modelValue", selectedRows.value);
@@ -14322,7 +14335,7 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
       }, [vue.createCommentVNode("", true), _cache[18] || (_cache[18] = vue.createTextVNode()), vue.createElementVNode("table", vue.mergeProps({
         class: ["table", tableClasses.value],
         role: tableRole.value
-      }, _ctx.$attrs), [hasCaption.value ? (vue.openBlock(), vue.createElementBlock("caption", _hoisted_2$d, [vue.renderSlot(_ctx.$slots, "caption")])) : vue.createCommentVNode("", true), _cache[15] || (_cache[15] = vue.createTextVNode()), vue.createElementVNode("colgroup", null, [vue.unref(isExpandableTable) ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_3$9)) : vue.createCommentVNode("", true), _cache[0] || (_cache[0] = vue.createTextVNode()), __props.selectable ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_4$8)) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(columns.value, (column) => {
+      }, _ctx.$attrs), [hasCaption.value ? (vue.openBlock(), vue.createElementBlock("caption", _hoisted_2$e, [vue.renderSlot(_ctx.$slots, "caption")])) : vue.createCommentVNode("", true), _cache[15] || (_cache[15] = vue.createTextVNode()), vue.createElementVNode("colgroup", null, [vue.unref(isExpandableTable) ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_3$9)) : vue.createCommentVNode("", true), _cache[0] || (_cache[0] = vue.createTextVNode()), __props.selectable ? (vue.openBlock(), vue.createElementBlock("col", _hoisted_4$8)) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(columns.value, (column) => {
         return vue.openBlock(), vue.createElementBlock("col", {
           key: column.id,
           class: vue.normalizeClass(column.size)
@@ -14336,7 +14349,7 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
           click: () => onClickColumnHeader(column)
         } : {}, true)), [vue.createElementVNode("span", {
           innerHTML: escapeNewlines(column.title)
-        }, null, 8, _hoisted_10$2), _cache[2] || (_cache[2] = vue.createTextVNode()), column.sortable ? (vue.openBlock(), vue.createBlock(vue.unref(FIcon), {
+        }, null, 8, _hoisted_10$1), _cache[2] || (_cache[2] = vue.createTextVNode()), column.sortable ? (vue.openBlock(), vue.createBlock(vue.unref(FIcon), {
           key: 0,
           class: vue.normalizeClass(iconClasses2(column)),
           name: iconName(column)
@@ -14406,11 +14419,11 @@ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
         colspan: nbOfColumns.value
       }, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createTextVNode(vue.toDisplayString(vue.unref($t2)("fkui.interactive-table.empty", "Tabellen är tom")), 1)])], 8, _hoisted_22), _cache[12] || (_cache[12] = vue.createTextVNode()), vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps({
         row: {}
-      })))])) : vue.createCommentVNode("", true)]))], 16, _hoisted_1$i)], 2);
+      })))])) : vue.createCommentVNode("", true)]))], 16, _hoisted_1$k)], 2);
     };
   }
 });
-const _sfc_main$h = vue.defineComponent({
+const _sfc_main$j = vue.defineComponent({
   name: "FLayoutApplicationTemplate",
   computed: {
     showHeader() {
@@ -14435,10 +14448,10 @@ const _sfc_main$h = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$h = {
+const _hoisted_1$j = {
   class: "layout-application-template"
 };
-const _hoisted_2$c = {
+const _hoisted_2$d = {
   key: 0,
   ref: "header",
   class: "layout-application-template__header"
@@ -14455,11 +14468,11 @@ const _hoisted_5$5 = {
   class: "layout-application-template__footer"
 };
 function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$h, [_ctx.showHeader || _ctx.showTopNavigation ? (vue.openBlock(), vue.createElementBlock("header", _hoisted_2$c, [_ctx.showHeader ? vue.renderSlot(_ctx.$slots, "header", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [_ctx.showHeader || _ctx.showTopNavigation ? (vue.openBlock(), vue.createElementBlock("header", _hoisted_2$d, [_ctx.showHeader ? vue.renderSlot(_ctx.$slots, "header", {
     key: 0
   }) : vue.createCommentVNode("", true), _cache[0] || (_cache[0] = vue.createTextVNode()), _ctx.showTopNavigation ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_3$8, [vue.renderSlot(_ctx.$slots, "top-navigation")])) : vue.createCommentVNode("", true)], 512)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createElementVNode("main", _hoisted_4$7, [vue.renderSlot(_ctx.$slots, "default"), _cache[1] || (_cache[1] = vue.createTextVNode()), _ctx.showFooter ? (vue.openBlock(), vue.createElementBlock("footer", _hoisted_5$5, [vue.renderSlot(_ctx.$slots, "footer")])) : vue.createCommentVNode("", true)], 512)]);
 }
-const FLayoutApplicationTemplate = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$d]]);
+const FLayoutApplicationTemplate = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$d]]);
 function getGridClasses(target) {
   if (target === null) {
     return {};
@@ -14560,7 +14573,7 @@ function useLayoutPanel(options) {
     rightPrimaryClasses
   };
 }
-const _sfc_main$g = vue.defineComponent({
+const _sfc_main$i = vue.defineComponent({
   name: "FLayoutLeftPanel",
   components: {
     FIcon
@@ -14645,10 +14658,10 @@ const _sfc_main$g = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$g = {
+const _hoisted_1$i = {
   class: "layout-navigation"
 };
-const _hoisted_2$b = ["aria-expanded"];
+const _hoisted_2$c = ["aria-expanded"];
 const _hoisted_3$7 = {
   class: "layout-navigation__navigation__inner"
 };
@@ -14658,7 +14671,7 @@ const _hoisted_4$6 = {
 };
 function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, [vue.createElementVNode("nav", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [vue.createElementVNode("nav", {
     id: "layout-navigation__navigation",
     class: "layout-navigation__navigation",
     style: vue.normalizeStyle(_ctx.navigationStyle),
@@ -14701,13 +14714,13 @@ function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
     class: "layout-navigation__navigation__border__dot"
   }, null, -1), vue.createTextVNode(), vue.createElementVNode("div", {
     class: "layout-navigation__navigation__border__dot"
-  }, null, -1)]), 32)) : vue.createCommentVNode("", true)], 12, _hoisted_2$b), _cache[14] || (_cache[14] = vue.createTextVNode()), vue.createElementVNode("div", {
+  }, null, -1)]), 32)) : vue.createCommentVNode("", true)], 12, _hoisted_2$c), _cache[14] || (_cache[14] = vue.createTextVNode()), vue.createElementVNode("div", {
     id: "layout-navigation__primary",
     class: vue.normalizeClass(["layout-navigation__primary", _ctx.leftPrimaryClasses]),
     style: vue.normalizeStyle(_ctx.primaryStyle)
   }, [vue.renderSlot(_ctx.$slots, "default")], 6)]);
 }
-const FLayoutLeftPanel = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["render", _sfc_render$c]]);
+const FLayoutLeftPanel = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["render", _sfc_render$c]]);
 class FRightPanelServiceImpl {
   constructor() {
     _defineProperty(this, "focusedElementBeforeOpenining", null);
@@ -14737,7 +14750,7 @@ class FRightPanelServiceImpl {
   }
 }
 const FLayoutRightPanelService = new FRightPanelServiceImpl();
-const _sfc_main$f = vue.defineComponent({
+const _sfc_main$h = vue.defineComponent({
   name: "FLayoutRightPanel",
   components: {
     FIcon
@@ -14854,15 +14867,15 @@ const _sfc_main$f = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$f = {
+const _hoisted_1$h = {
   class: "layout-secondary"
 };
-const _hoisted_2$a = {
+const _hoisted_2$b = {
   class: "layout-secondary__secondary__inner"
 };
 function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_icon = vue.resolveComponent("f-icon");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$f, [vue.createElementVNode("div", {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$h, [vue.createElementVNode("div", {
     id: "layout-secondary__primary",
     class: vue.normalizeClass(["layout-secondary__primary", _ctx.rightPrimaryClasses]),
     style: vue.normalizeStyle(_ctx.primaryStyle)
@@ -14879,7 +14892,7 @@ function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
     class: "layout-secondary__secondary__border__dot"
   }, null, -1), vue.createTextVNode(), vue.createElementVNode("div", {
     class: "layout-secondary__secondary__border__dot"
-  }, null, -1)]), 32), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_2$a, [vue.createElementVNode("div", {
+  }, null, -1)]), 32), _cache[9] || (_cache[9] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_2$b, [vue.createElementVNode("div", {
     ref: "title",
     class: "layout-secondary__secondary__inner__title",
     style: vue.normalizeStyle(_ctx.contentStyle)
@@ -14899,33 +14912,32 @@ function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
     name: "close"
   })])], 6)])], 4)) : vue.createCommentVNode("", true)]);
 }
-const FLayoutRightPanel = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$b]]);
-const _hoisted_1$e = {
+const FLayoutRightPanel = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$b]]);
+const _hoisted_1$g = {
   key: 0,
   class: "list"
 };
-const _hoisted_2$9 = {
+const _hoisted_2$a = {
   key: 0,
   class: "list__item"
 };
 const _hoisted_3$6 = {
   class: "list__item__itempane"
 };
-const _hoisted_4$5 = ["tabindex"];
-const _hoisted_5$4 = ["id", "aria-labelledby", "tabindex", "onKeydown"];
-const _hoisted_6$3 = ["onClick"];
-const _hoisted_7$2 = {
+const _hoisted_4$5 = ["id", "aria-labelledby", "tabindex", "onKeydown"];
+const _hoisted_5$4 = ["onClick"];
+const _hoisted_6$3 = {
   class: "list__item__selectpane__input"
 };
-const _hoisted_8$2 = ["id"];
-const _hoisted_9$2 = {
+const _hoisted_7$2 = ["id"];
+const _hoisted_8$2 = {
   key: 0,
   class: "list__item"
 };
-const _hoisted_10$1 = {
+const _hoisted_9$2 = {
   class: "list__item__itempane"
 };
-const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
   __name: "FList",
   props: {
     /**
@@ -15149,7 +15161,7 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
       return props.checkbox && itemEquals(activeItem.value, item, props.keyAttribute);
     }
     return (_ctx, _cache) => {
-      return !__props.selectable ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_1$e, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
+      return !__props.selectable ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_1$g, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
         return vue.openBlock(), vue.createElementBlock("li", {
           key: itemKey(item),
           class: "list__item"
@@ -15162,12 +15174,11 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
         }, {
           item
         }))], 512)]);
-      }), 128)), _cache[0] || (_cache[0] = vue.createTextVNode()), isEmpty.value ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_2$9, [vue.createElementVNode("div", _hoisted_3$6, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createElementVNode("em", null, vue.toDisplayString(vue.unref($t2)("fkui.list.empty", "Listan är tom")), 1)])])])) : vue.createCommentVNode("", true)])) : (vue.openBlock(), vue.createElementBlock("ul", {
+      }), 128)), _cache[0] || (_cache[0] = vue.createTextVNode()), isEmpty.value ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_2$a, [vue.createElementVNode("div", _hoisted_3$6, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createElementVNode("em", null, vue.toDisplayString(vue.unref($t2)("fkui.list.empty", "Listan är tom")), 1)])])])) : vue.createCommentVNode("", true)])) : (vue.openBlock(), vue.createElementBlock("ul", {
         key: 1,
         ref_key: "ulElement",
         ref: ulElement,
-        class: "list list--hover",
-        tabindex: __props.checkbox ? 0 : void 0
+        class: "list list--hover"
       }, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item, index) => {
         return vue.openBlock(), vue.createElementBlock("li", {
           id: getItemId(item),
@@ -15182,7 +15193,7 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
           key: 0,
           class: "list__item__selectpane",
           onClick: vue.withModifiers(($event) => onSelect(item), ["self"])
-        }, [vue.createElementVNode("div", _hoisted_7$2, [vue.createVNode(vue.unref(FCheckboxField), {
+        }, [vue.createElementVNode("div", _hoisted_6$3, [vue.createVNode(vue.unref(FCheckboxField), {
           value: true,
           "model-value": isSelected(item),
           onClick: vue.withModifiers(($event) => onSelect(item), ["self"])
@@ -15194,9 +15205,9 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
             ref_for: true
           }, {
             item
-          }))], 8, _hoisted_8$2)]),
+          }))], 8, _hoisted_7$2)]),
           _: 2
-        }, 1032, ["model-value", "onClick"])])], 8, _hoisted_6$3)) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.checkbox ? "div" : "a"), {
+        }, 1032, ["model-value", "onClick"])])], 8, _hoisted_5$4)) : vue.createCommentVNode("", true), _cache[1] || (_cache[1] = vue.createTextVNode()), (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.checkbox ? "div" : "a"), {
           ref_for: true,
           ref: "listItemPanes",
           href: !__props.checkbox ? "javascript:" : void 0,
@@ -15209,12 +15220,12 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
             item
           }))]),
           _: 2
-        }, 1032, ["href", "onClick"]))], 42, _hoisted_5$4);
-      }), 128)), _cache[2] || (_cache[2] = vue.createTextVNode()), isEmpty.value ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_9$2, [vue.createElementVNode("div", _hoisted_10$1, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createElementVNode("em", null, vue.toDisplayString(vue.unref($t2)("fkui.list.empty", "Listan är tom")), 1)])])])) : vue.createCommentVNode("", true)], 8, _hoisted_4$5));
+        }, 1032, ["href", "onClick"]))], 42, _hoisted_4$5);
+      }), 128)), _cache[2] || (_cache[2] = vue.createTextVNode()), isEmpty.value ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_8$2, [vue.createElementVNode("div", _hoisted_9$2, [vue.renderSlot(_ctx.$slots, "empty", {}, () => [vue.createElementVNode("em", null, vue.toDisplayString(vue.unref($t2)("fkui.list.empty", "Listan är tom")), 1)])])])) : vue.createCommentVNode("", true)], 512));
     };
   }
 });
-const _sfc_main$d = vue.defineComponent({
+const _sfc_main$f = vue.defineComponent({
   name: "FLoader",
   mixins: [TranslationMixin],
   inheritAttrs: false,
@@ -15326,10 +15337,10 @@ const _sfc_main$d = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$d = {
+const _hoisted_1$f = {
   class: "loader__backdrop"
 };
-const _hoisted_2$8 = {
+const _hoisted_2$9 = {
   role: "alert"
 };
 function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
@@ -15338,7 +15349,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
     disabled: _ctx.teleportDisabled
   }, [vue.withDirectives(vue.createElementVNode("div", vue.mergeProps(_ctx.$attrs, {
     class: ["loader", _ctx.classes]
-  }), [vue.createElementVNode("div", _hoisted_1$d, [_cache[0] || (_cache[0] = vue.createElementVNode("div", {
+  }), [vue.createElementVNode("div", _hoisted_1$f, [_cache[0] || (_cache[0] = vue.createElementVNode("div", {
     class: "loader__wrapper"
   }, [vue.createElementVNode("div", {
     class: "loader__spinner-1 loader__spinner"
@@ -15376,10 +15387,10 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
       "loader--delay": _ctx.delay
     }]),
     tabindex: "-1"
-  }, [vue.createElementVNode("span", _hoisted_2$8, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.$t("fkui.loader.wait.text", _ctx.defaultLoadingText)), 1)])])], 2)])], 16), [[vue.vShow, _ctx.show]])], 8, ["to", "disabled"]);
+  }, [vue.createElementVNode("span", _hoisted_2$9, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(vue.toDisplayString(_ctx.$t("fkui.loader.wait.text", _ctx.defaultLoadingText)), 1)])])], 2)])], 16), [[vue.vShow, _ctx.show]])], 8, ["to", "disabled"]);
 }
-const FLoader = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$a]]);
-const _hoisted_1$c = ["aria-label"];
+const FLoader = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$a]]);
+const _hoisted_1$e = ["aria-label"];
 const __default__ = vue.defineComponent({
   computed: {
     ariaLabel() {
@@ -15391,7 +15402,7 @@ const __default__ = vue.defineComponent({
     }
   }
 });
-const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
   ...__default__,
   __name: "FLogo",
   props: {
@@ -15415,7 +15426,7 @@ const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
         class: vue.normalizeClass(`logo logo--${props.size}`),
         "aria-label": _ctx.ariaLabel,
         role: "img"
-      }, null, 10, _hoisted_1$c);
+      }, null, 10, _hoisted_1$e);
     };
   }
 });
@@ -15445,7 +15456,7 @@ const iconClasses = {
     screenReaderContextDefault: "Informationsmeddelande"
   }
 };
-const _sfc_main$b = vue.defineComponent({
+const _sfc_main$d = vue.defineComponent({
   name: "FMessageBox",
   components: {
     FIcon,
@@ -15535,7 +15546,7 @@ const _sfc_main$b = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$b = {
+const _hoisted_1$d = {
   key: 0,
   class: "sr-only"
 };
@@ -15545,7 +15556,7 @@ function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_i_flex = vue.resolveComponent("i-flex");
   return vue.openBlock(), vue.createElementBlock("div", {
     class: vue.normalizeClass(["message-box", [_ctx.messageBoxType, _ctx.bannerType]])
-  }, [_ctx.provideScreenReaderContext ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$b, vue.toDisplayString(_ctx.screenReaderContext()), 1)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createVNode(_component_i_flex, {
+  }, [_ctx.provideScreenReaderContext ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$d, vue.toDisplayString(_ctx.screenReaderContext()), 1)) : vue.createCommentVNode("", true), _cache[2] || (_cache[2] = vue.createTextVNode()), vue.createVNode(_component_i_flex, {
     gap: "2x"
   }, {
     default: vue.withCtx(() => [_ctx.layout === "short" ? (vue.openBlock(), vue.createBlock(_component_i_flex_item, {
@@ -15577,7 +15588,7 @@ function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   })], 2);
 }
-const FMessageBox = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$9]]);
+const FMessageBox = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$9]]);
 function findOverflowIndex(totalWidth, elements) {
   let sum = 0;
   const index = elements.findIndex((element) => {
@@ -15627,7 +15638,7 @@ const upKeys = ["Up", "ArrowUp"];
 const downKeys = ["Down", "ArrowDown"];
 const verticalKeys = [...upKeys, ...downKeys];
 const preventKeys = ["Tab", "Left", "Right", "ArrowLeft", "ArrowRight", "Home", "End", " ", "Spacebar", "Enter", ...verticalKeys];
-const _sfc_main$a = vue.defineComponent({
+const _sfc_main$c = vue.defineComponent({
   name: "FNavigationMenu",
   components: {
     FIcon,
@@ -15960,8 +15971,8 @@ const _sfc_main$a = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$a = ["aria-label"];
-const _hoisted_2$7 = ["data-ref-index", "onClick"];
+const _hoisted_1$c = ["aria-label"];
+const _hoisted_2$8 = ["data-ref-index", "onClick"];
 const _hoisted_3$5 = {
   class: "imenu__list__anchor-container"
 };
@@ -16012,7 +16023,7 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
       target: item.target,
       class: "imenu__list__anchor",
       role: "menuitem"
-    }, [_ctx.showItemSrText(index) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$3, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.selectedItemSrText) + " ", 1)])) : vue.createCommentVNode("", true), vue.createTextVNode(" " + vue.toDisplayString(item.label), 1)], 8, _hoisted_4$4)])], 10, _hoisted_2$7);
+    }, [_ctx.showItemSrText(index) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$3, [vue.createElementVNode("span", null, vue.toDisplayString(_ctx.selectedItemSrText) + " ", 1)])) : vue.createCommentVNode("", true), vue.createTextVNode(" " + vue.toDisplayString(item.label), 1)], 8, _hoisted_4$4)])], 10, _hoisted_2$8);
   }), 128)), _cache[6] || (_cache[6] = vue.createTextVNode()), _ctx.hasOverflow ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_6$2, [vue.createElementVNode("div", {
     ref: "popup-item",
     class: vue.normalizeClass(_ctx.popupItemClasses),
@@ -16041,11 +16052,11 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
     "enable-keyboard-navigation": "",
     onSelect: _ctx.onPopupMenuItemSelected,
     onClose: _cache[5] || (_cache[5] = ($event) => _ctx.togglePopup(false))
-  }, null, 8, ["modelValue", "focused-item", "items", "is-open", "anchor", "selected-menu-item-screen-reader-text", "aria-label", "onSelect"])], 10, _hoisted_1$a);
+  }, null, 8, ["modelValue", "focused-item", "items", "is-open", "anchor", "selected-menu-item-screen-reader-text", "aria-label", "onSelect"])], 10, _hoisted_1$c);
 }
-const FNavigationMenu = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$8]]);
+const FNavigationMenu = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$8]]);
 const EVENTS = ["online", "offline"];
-const _sfc_main$9 = vue.defineComponent({
+const _sfc_main$b = vue.defineComponent({
   name: "FOffline",
   components: {
     FIcon,
@@ -16093,8 +16104,8 @@ const _sfc_main$9 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$9 = ["role"];
-const _hoisted_2$6 = {
+const _hoisted_1$b = ["role"];
+const _hoisted_2$7 = {
   key: 0,
   class: "offline"
 };
@@ -16113,7 +16124,7 @@ function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
     ref: "offline",
     class: "offline__wrapper",
     role: _ctx.role
-  }, [!_ctx.isOnline ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$6, [vue.createVNode(_component_i_flex, {
+  }, [!_ctx.isOnline ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$7, [vue.createVNode(_component_i_flex, {
     gap: "2x"
   }, {
     default: vue.withCtx(() => [vue.createVNode(_component_i_flex_item, {
@@ -16139,10 +16150,10 @@ function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
   })])) : vue.createCommentVNode("", true), _cache[3] || (_cache[3] = vue.createTextVNode()), vue.withDirectives(vue.createElementVNode("span", {
     class: "sr-only",
     "aria-hidden": _ctx.shouldNotRead ? "true" : void 0
-  }, "\n            Din internetuppkoppling fungerar igen\n        ", 8, _hoisted_5$2), [[vue.vShow, _ctx.isOnline]])], 8, _hoisted_1$9);
+  }, "\n            Din internetuppkoppling fungerar igen\n        ", 8, _hoisted_5$2), [[vue.vShow, _ctx.isOnline]])], 8, _hoisted_1$b);
 }
-const FOffline = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$7]]);
-const _sfc_main$8 = vue.defineComponent({
+const FOffline = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$7]]);
+const _sfc_main$a = vue.defineComponent({
   name: "FOutputField",
   components: {
     FLabel
@@ -16175,13 +16186,13 @@ const _sfc_main$8 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$8 = {
+const _hoisted_1$a = {
   class: "output-field"
 };
-const _hoisted_2$5 = ["id", "for"];
+const _hoisted_2$6 = ["id", "for"];
 function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_f_label = vue.resolveComponent("f-label");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [vue.createVNode(_component_f_label, {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [vue.createVNode(_component_f_label, {
     for: _ctx.id
   }, vue.createSlots({
     default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "label")]),
@@ -16194,10 +16205,10 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
     id: _ctx.id,
     for: _ctx.htmlFor,
     class: "output-field__output"
-  }, _ctx.$attrs), [vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_2$5)]);
+  }, _ctx.$attrs), [vue.renderSlot(_ctx.$slots, "default")], 16, _hoisted_2$6)]);
 }
-const FOutputField = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$6]]);
-const _sfc_main$7 = vue.defineComponent({
+const FOutputField = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$6]]);
+const _sfc_main$9 = vue.defineComponent({
   name: "FPageHeader",
   components: {
     ISkipLink
@@ -16244,10 +16255,10 @@ const _sfc_main$7 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$7 = {
+const _hoisted_1$9 = {
   class: "page-header__root"
 };
-const _hoisted_2$4 = {
+const _hoisted_2$5 = {
   key: 0
 };
 const _hoisted_3$3 = {
@@ -16266,7 +16277,7 @@ const _hoisted_6$1 = {
 };
 function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_i_skip_link = vue.resolveComponent("i-skip-link");
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [_ctx.skipLinkAnchor ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_2$4, [vue.createVNode(_component_i_skip_link, {
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [_ctx.skipLinkAnchor ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_2$5, [vue.createVNode(_component_i_skip_link, {
     href: _ctx.skipLinkAnchor
   }, {
     default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "skip-link-text")]),
@@ -16278,7 +16289,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   })), _cache[1] || (_cache[1] = vue.createTextVNode()), vue.createElementVNode("div", _hoisted_5$1, [vue.createElementVNode("div", _hoisted_6$1, [vue.renderSlot(_ctx.$slots, "right")])])], 512)]);
 }
-const FPageHeader = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$5]]);
+const FPageHeader = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$5]]);
 const layoutRegister = {};
 function getLayout(name) {
   var _layoutRegister$name;
@@ -16416,7 +16427,7 @@ registerLayout({
     }
   }
 });
-const styleContent = '.page-layout {\n    display: grid;\n    height: 100cqh;\n    width: min(100%, 100cqw);\n\n    &[part~="simple"] {\n        grid-template:\n            "header" min-content\n            "content" 1fr\n            "footer" min-content\n            / 1fr;\n    }\n\n    &[part~="left-panel"] {\n        grid-template:\n            "header header" min-content\n            "left content" 1fr\n            "footer footer" min-content\n            / min-content 1fr;\n    }\n\n    &[part~="right-panel"] {\n        grid-template:\n            "header header" min-content\n            "content right" 1fr\n            "footer footer" min-content\n            / 1fr min-content;\n    }\n\n    &[part~="three-column"] {\n        grid-template:\n            "header header header" min-content\n            "left content right" 1fr\n            "footer footer footer" min-content\n            / min-content 1fr min-content;\n    }\n}\n\n.page-layout__area {\n    display: flex;\n    position: relative;\n\n    &[data-direction="column"] {\n        flex-direction: column;\n    }\n\n    &[data-direction="row"] {\n        flex-direction: row;\n    }\n\n    &[data-scroll] {\n        overflow-y: auto;\n    }\n\n    &:empty {\n        display: none;\n    }\n}\n\n:host ::slotted(*) {\n    display: contents;\n}\n';
+const styleContent = ':host {\n    display: block;\n}\n\n.page-layout {\n    display: grid;\n    height: 100cqh;\n    width: min(100%, 100cqw);\n\n    &[part~="simple"] {\n        grid-template:\n            "header" min-content\n            "content" 1fr\n            "footer" min-content\n            / 1fr;\n\n        [part="area header"],\n        [part="area footer"] {\n            background: var(--f-background-pageheader-primary);\n            color: var(--fkds-color-text-inverted);\n        }\n\n        [part="area content"] {\n            background: var(--fkds-color-background-primary);\n            color: var(--fkds-color-text-primary);\n        }\n    }\n\n    &[part~="left-panel"] {\n        grid-template:\n            "header header" min-content\n            "left content" 1fr\n            "footer footer" min-content\n            / min-content 1fr;\n\n        [part="area header"],\n        [part="area footer"] {\n            background: var(--f-background-pageheader-primary);\n            color: var(--fkds-color-text-inverted);\n        }\n\n        [part="area left"] {\n            background: var(--fkds-color-background-secondary);\n        }\n\n        [part="area content"] {\n            background: var(--fkds-color-background-primary);\n            color: var(--fkds-color-text-primary);\n        }\n    }\n\n    &[part~="right-panel"] {\n        grid-template:\n            "header header" min-content\n            "content right" 1fr\n            "footer footer" min-content\n            / 1fr min-content;\n\n        [part="area header"],\n        [part="area footer"] {\n            background: var(--f-background-pageheader-primary);\n            color: var(--fkds-color-text-inverted);\n        }\n\n        [part="area right"] {\n            background: var(--fkds-color-background-secondary);\n            color: var(--fkds-color-text-primary);\n        }\n\n        [part="area content"] {\n            background: var(--fkds-color-background-primary);\n            color: var(--fkds-color-text-primary);\n        }\n    }\n\n    &[part~="three-column"] {\n        grid-template:\n            "header header header" min-content\n            "left content right" 1fr\n            "footer footer footer" min-content\n            / min-content 1fr min-content;\n\n        [part="area header"],\n        [part="area footer"] {\n            background: var(--f-background-pageheader-primary);\n            color: var(--fkds-color-text-inverted);\n        }\n\n        [part="area left"],\n        [part="area right"] {\n            background: var(--fkds-color-background-secondary);\n            color: var(--fkds-color-text-primary);\n        }\n\n        [part="area content"] {\n            background: var(--fkds-color-background-primary);\n            color: var(--fkds-color-text-primary);\n        }\n    }\n}\n\n.page-layout__area {\n    display: flex;\n    position: relative;\n\n    &[data-direction="column"] {\n        flex-direction: column;\n    }\n\n    &[data-direction="row"] {\n        flex-direction: row;\n    }\n\n    &[data-scroll] {\n        overflow-y: auto;\n    }\n\n    &:empty {\n        display: none;\n    }\n}\n\n:host ::slotted(*) {\n    display: contents;\n}\n';
 const stubLayout = defineLayout({
   name: "",
   areas: {}
@@ -16520,9 +16531,9 @@ class PageLayout extends HTMLElement {
     }
   }
 }
-const _hoisted_1$6 = ["slot"];
-const tagName = `ce-page-layout`;
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$8 = ["slot"];
+const tagName$1 = `ce-page-layout`;
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "FPageLayout",
   props: {
     layout: {}
@@ -16533,19 +16544,19 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
       return Object.keys(slots);
     });
     vue.onMounted(() => {
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, PageLayout);
+      if (!customElements.get(tagName$1)) {
+        customElements.define(tagName$1, PageLayout);
       }
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tagName), {
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tagName$1), {
         layout: _ctx.layout
       }, {
         default: vue.withCtx(() => [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(slotNames.value, (slot) => {
           return vue.openBlock(), vue.createElementBlock("div", {
             key: slot,
             slot
-          }, [vue.renderSlot(_ctx.$slots, slot)], 8, _hoisted_1$6);
+          }, [vue.renderSlot(_ctx.$slots, slot)], 8, _hoisted_1$8);
         }), 128))]),
         _: 3
       }, 8, ["layout"]);
@@ -16578,16 +16589,16 @@ function useAreaData(element) {
     direction
   };
 }
-const _hoisted_1$5 = {
+const _hoisted_1$7 = {
   class: "progress"
 };
-const _hoisted_2$3 = ["aria-label", "aria-valuenow", "aria-valuetext"];
+const _hoisted_2$4 = ["aria-label", "aria-valuenow", "aria-valuetext"];
 const _hoisted_3$2 = {
   class: "sr-only"
 };
 const MIN_VALUE = 0;
 const MAX_VALUE = 100;
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "FProgressbar",
   props: {
     /**
@@ -16626,10 +16637,10 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const props = __props;
     const ariaLabel = props.ariaLabel;
-    function clamp(val) {
+    function clamp2(val) {
       return Math.round(Math.min(Math.max(val || 0, MIN_VALUE), MAX_VALUE));
     }
-    const progressValueNow = vue.computed(() => clamp(props.value));
+    const progressValueNow = vue.computed(() => clamp2(props.value));
     const cssWidth = vue.computed(() => `width: ${progressValueNow.value}%`);
     const progressBarClass = vue.computed(() => {
       if (progressValueNow.value === MIN_VALUE) {
@@ -16644,7 +16655,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
       return `${props.valueText.replace("%VALUE%", progressValueNow.value.toString())}`;
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [vue.createElementVNode("span", {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [vue.createElementVNode("span", {
         class: vue.normalizeClass(["progress__meter", progressBarClass.value]),
         role: "progressbar",
         "aria-label": vue.unref(ariaLabel),
@@ -16653,12 +16664,12 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
         "aria-valuenow": progressValueNow.value,
         "aria-valuetext": progressText.value,
         style: vue.normalizeStyle(cssWidth.value)
-      }, [vue.createElementVNode("span", _hoisted_3$2, vue.toDisplayString(progressText.value), 1)], 14, _hoisted_2$3)]);
+      }, [vue.createElementVNode("span", _hoisted_3$2, vue.toDisplayString(progressText.value), 1)], 14, _hoisted_2$4)]);
     };
   }
 });
 const anyType = [String, Object, Array, Number, Date, Boolean];
-const _sfc_main$4 = vue.defineComponent({
+const _sfc_main$6 = vue.defineComponent({
   name: "FRadioField",
   inheritAttrs: false,
   props: {
@@ -16814,8 +16825,8 @@ const _sfc_main$4 = vue.defineComponent({
     }
   }
 });
-const _hoisted_1$4 = ["id", "disabled"];
-const _hoisted_2$2 = ["for"];
+const _hoisted_1$6 = ["id", "disabled"];
+const _hoisted_2$3 = ["for"];
 const _hoisted_3$1 = {
   key: 0,
   class: "radio-button__details"
@@ -16833,7 +16844,7 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
     type: "radio",
     class: "radio-button__input",
     disabled: _ctx.disabled
-  }, _ctx.attrs), null, 16, _hoisted_1$4), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("label", {
+  }, _ctx.attrs), null, 16, _hoisted_1$6), _cache[7] || (_cache[7] = vue.createTextVNode()), vue.createElementVNode("label", {
     class: vue.normalizeClass(_ctx.$slots.details ? "radio-button__label radio-button__width" : "radio-button__label"),
     for: _ctx.id
   }, [vue.renderSlot(_ctx.$slots, "default"), _cache[6] || (_cache[6] = vue.createTextVNode()), _ctx.$slots.details ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
@@ -16848,9 +16859,463 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
       height: _ctx.height
     })])) : vue.createCommentVNode("", true)]),
     _: 3
-  }, 8, ["onEnter", "onAfterEnter", "onLeave"])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)], 10, _hoisted_2$2)], 34);
+  }, 8, ["onEnter", "onAfterEnter", "onLeave"])) : vue.createCommentVNode("", true)], 64)) : vue.createCommentVNode("", true)], 10, _hoisted_2$3)], 34);
+}
+const FRadioField = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$4]]);
+function tryOnScopeDispose(fn2) {
+  if (vue.getCurrentScope()) {
+    vue.onScopeDispose(fn2);
+    return true;
+  }
+  return false;
 }
-const FRadioField = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$4]]);
+const isClient = typeof window !== "undefined" && typeof document !== "undefined";
+typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
+const toString = Object.prototype.toString;
+const isObject = (val) => toString.call(val) === "[object Object]";
+function toArray(value) {
+  return Array.isArray(value) ? value : [value];
+}
+function watchImmediate(source, cb, options) {
+  return vue.watch(
+    source,
+    cb,
+    {
+      ...options,
+      immediate: true
+    }
+  );
+}
+const defaultWindow = isClient ? window : void 0;
+function unrefElement(elRef) {
+  var _a;
+  const plain = vue.toValue(elRef);
+  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
+}
+function useEventListener(...args) {
+  const cleanups = [];
+  const cleanup = () => {
+    cleanups.forEach((fn2) => fn2());
+    cleanups.length = 0;
+  };
+  const register = (el, event, listener, options) => {
+    el.addEventListener(event, listener, options);
+    return () => el.removeEventListener(event, listener, options);
+  };
+  const firstParamTargets = vue.computed(() => {
+    const test = toArray(vue.toValue(args[0])).filter((e) => e != null);
+    return test.every((e) => typeof e !== "string") ? test : void 0;
+  });
+  const stopWatch = watchImmediate(
+    () => {
+      var _a, _b;
+      return [
+        (_b = (_a = firstParamTargets.value) == null ? void 0 : _a.map((e) => unrefElement(e))) != null ? _b : [defaultWindow].filter((e) => e != null),
+        toArray(vue.toValue(firstParamTargets.value ? args[1] : args[0])),
+        toArray(vue.unref(firstParamTargets.value ? args[2] : args[1])),
+        // @ts-expect-error - TypeScript gets the correct types, but somehow still complains
+        vue.toValue(firstParamTargets.value ? args[3] : args[2])
+      ];
+    },
+    ([raw_targets, raw_events, raw_listeners, raw_options]) => {
+      cleanup();
+      if (!(raw_targets == null ? void 0 : raw_targets.length) || !(raw_events == null ? void 0 : raw_events.length) || !(raw_listeners == null ? void 0 : raw_listeners.length))
+        return;
+      const optionsClone = isObject(raw_options) ? { ...raw_options } : raw_options;
+      cleanups.push(
+        ...raw_targets.flatMap(
+          (el) => raw_events.flatMap(
+            (event) => raw_listeners.map((listener) => register(el, event, listener, optionsClone))
+          )
+        )
+      );
+    },
+    { flush: "post" }
+  );
+  const stop = () => {
+    stopWatch();
+    cleanup();
+  };
+  tryOnScopeDispose(cleanup);
+  return stop;
+}
+const keymap = {
+  left: {
+    ArrowLeft: "decrease",
+    ArrowRight: "increase",
+    Home: "minimize",
+    End: "maximize"
+  },
+  right: {
+    ArrowLeft: "increase",
+    ArrowRight: "decrease",
+    Home: "minimize",
+    End: "maximize"
+  },
+  top: {
+    ArrowUp: "decrease",
+    ArrowDown: "increase",
+    Home: "minimize",
+    End: "maximize"
+  },
+  bottom: {
+    ArrowUp: "increase",
+    ArrowDown: "decrease",
+    Home: "minimize",
+    End: "maximize"
+  },
+  none: {}
+};
+function useKeyboardHandler(options) {
+  const {
+    attachment,
+    separator
+  } = options;
+  useEventListener(separator, "keydown", (event) => {
+    if (!attachment.value) {
+      return;
+    }
+    const action = keymap[attachment.value][event.key];
+    if (action) {
+      event.preventDefault();
+      options[action]();
+    }
+  });
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function usePointerHandler(options) {
+  const {
+    separator,
+    attachment
+  } = options;
+  const invert = vue.computed(() => {
+    if (attachment.value === "right" || attachment.value === "bottom") {
+      return -1;
+    }
+    return 1;
+  });
+  const orientation = vue.computed(() => {
+    if (attachment.value === "top" || attachment.value === "bottom") {
+      return "horizontal";
+    } else {
+      return "vertical";
+    }
+  });
+  useEventListener(separator, "pointerdown", (event) => {
+    const {
+      isPrimary,
+      button,
+      target,
+      pointerId
+    } = event;
+    if (!separator.value) {
+      return;
+    }
+    if (!isPrimary || button !== 0 || target !== separator.value) {
+      return;
+    }
+    const separatorElement = separator.value;
+    const property = orientation.value === "horizontal" ? "clientY" : "clientX";
+    const reference = event[property];
+    const resize = createResizer();
+    function onPointerMove(event2) {
+      if (event2.pointerId === pointerId) {
+        resize(event2[property] - reference);
+      }
+    }
+    function onLostPointerCapture(event2) {
+      if (event2.pointerId === pointerId) {
+        separatorElement.removeEventListener("pointermove", onPointerMove);
+        separatorElement.removeEventListener("lostpointercapture", onLostPointerCapture);
+      }
+    }
+    onPointerMove(event);
+    separatorElement.addEventListener("lostpointercapture", onLostPointerCapture);
+    separatorElement.addEventListener("pointermove", onPointerMove);
+    separatorElement.setPointerCapture(pointerId);
+    event.preventDefault();
+  });
+  function createResizer() {
+    const {
+      min,
+      max,
+      current: value
+    } = options.state.value;
+    return (amount) => {
+      options.movement(clamp(value + amount * invert.value, min, max));
+    };
+  }
+}
+function computeCssValue(raw, total, auto) {
+  if (raw.endsWith("px")) {
+    return parseInt(raw.slice(0, -2), 10);
+  } else if (raw.endsWith("%")) {
+    const value = parseInt(raw.slice(0, -1), 10);
+    const percent = value / 100;
+    return percent * total;
+  } else if (raw === "0") {
+    return 0;
+  } else if (raw === "auto") {
+    return auto;
+  } else {
+    throw new Error(`Cant parse size from "${raw}"`);
+  }
+}
+function aggregateCssValue(raw, total, auto, take) {
+  if (raw === "auto") {
+    return auto;
+  }
+  const parts = raw.split(/\s+/).map((it) => it.trim());
+  const parsed = parts.map((it) => computeCssValue(it, total, auto));
+  return take(...parsed);
+}
+function useStorage(options) {
+  const {
+    state,
+    storageKey
+  } = options;
+  const loaded = vue.ref(false);
+  let last = -1;
+  vue.watchEffect(() => {
+    if (!loaded.value) {
+      return;
+    }
+    if (!storageKey.value) {
+      return;
+    }
+    if (state.value.current < 0 || state.value.current === last) {
+      return;
+    }
+    const json = JSON.stringify(state.value.current);
+    window.localStorage.setItem(storageKey.value, json);
+    last = state.value.current;
+  });
+  vue.watchEffect(() => {
+    if (!storageKey.value) {
+      return;
+    }
+    const json = window.localStorage.getItem(storageKey.value);
+    if (json) {
+      const value = JSON.parse(json);
+      state.value.current = clamp(value, state.value.min, state.value.max);
+      last = value;
+    }
+    loaded.value = true;
+  });
+}
+const _hoisted_1$5 = ["aria-orientation"];
+const _hoisted_2$2 = ["aria-orientation"];
+const STEP_SIZE = 10;
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+  __name: "FResizePane.ce",
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    min: {
+      default: "0",
+      type: String
+    },
+    max: {
+      default: "100%",
+      type: String
+    },
+    initial: {
+      default: "50%",
+      type: String
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const root = vue.shallowRef();
+    const content = vue.ref();
+    const separator = vue.ref();
+    const state = vue.ref({
+      min: -1,
+      max: -1,
+      current: -1
+    });
+    const separatorSize = vue.ref(0);
+    const layoutSize = vue.ref(0);
+    const storageKey = vue.computed(() => area.value ? `layout/${area.value}/size` : null);
+    const {
+      attachPanel: attachment,
+      area
+    } = useAreaData(root);
+    useKeyboardHandler({
+      increase() {
+        state.value.current = Math.min(state.value.current + STEP_SIZE, state.value.max);
+      },
+      decrease() {
+        state.value.current = Math.max(state.value.current - STEP_SIZE, state.value.min);
+      },
+      maximize() {
+        state.value.current = state.value.max;
+      },
+      minimize() {
+        state.value.current = state.value.min;
+      },
+      attachment,
+      separator
+    });
+    useStorage({
+      state,
+      storageKey
+    });
+    usePointerHandler({
+      movement(value) {
+        state.value.current = value;
+      },
+      separator,
+      state,
+      attachment
+    });
+    const minSize = vue.computed(() => {
+      const total = layoutSize.value;
+      return Math.floor(aggregateCssValue(props.min, total, 0, Math.max) + separatorSize.value);
+    });
+    const maxSize = vue.computed(() => {
+      const total = layoutSize.value;
+      return Math.floor(aggregateCssValue(props.max, total, total, Math.min) + separatorSize.value);
+    });
+    const initialSize = vue.computed(() => {
+      const total = layoutSize.value;
+      return Math.floor(computeCssValue(props.initial, total, total * 0.5));
+    });
+    const orientation = vue.computed(() => {
+      if (attachment.value === "top" || attachment.value === "bottom") {
+        return "horizontal";
+      } else {
+        return "vertical";
+      }
+    });
+    const layoutElement = vue.computed(() => {
+      var _host$closest;
+      if (!root.value) {
+        return void 0;
+      }
+      const shadow = root.value.getRootNode();
+      const host = shadow.host;
+      return (_host$closest = host.closest("ce-page-layout")) !== null && _host$closest !== void 0 ? _host$closest : void 0;
+    });
+    vue.watchEffect(() => {
+      const {
+        min,
+        max,
+        current: value
+      } = state.value;
+      if (root.value) {
+        root.value.style.setProperty("--size", `${String(value)}px`);
+        root.value.style.setProperty("--min", `${min}px`);
+        root.value.style.setProperty("--max", `${max}px`);
+      }
+      if (separator.value) {
+        separator.value.setAttribute("aria-valuemin", String(Math.floor(min)));
+        separator.value.setAttribute("aria-valuemax", String(Math.floor(max)));
+        separator.value.setAttribute("aria-valuenow", String(Math.floor(value)));
+      }
+    });
+    vue.onMounted(() => {
+      if (separator.value) {
+        const {
+          flexBasis
+        } = getComputedStyle(separator.value);
+        separatorSize.value = computeCssValue(flexBasis, 0, 0);
+      }
+      layoutSize.value = getLayoutSize();
+      state.value = {
+        min: minSize.value,
+        max: maxSize.value,
+        current: clamp(initialSize.value, minSize.value, maxSize.value)
+      };
+    });
+    useEventListener$1(window, "resize", logic.debounce(onResize, 20));
+    function onResize() {
+      layoutSize.value = getLayoutSize();
+      state.value = {
+        min: minSize.value,
+        max: maxSize.value,
+        current: initialSize.value
+      };
+    }
+    function getLayoutSize() {
+      if (!layoutElement.value) {
+        return 0;
+      }
+      switch (orientation.value) {
+        case "horizontal": {
+          return layoutElement.value.offsetHeight;
+        }
+        case "vertical": {
+          return layoutElement.value.offsetWidth;
+        }
+      }
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        ref_key: "root",
+        ref: root,
+        class: vue.normalizeClass(["resize", `resize--${vue.unref(attachment)}`])
+      }, [vue.createElementVNode("div", {
+        ref_key: "content",
+        ref: content,
+        class: "resize__content"
+      }, [vue.renderSlot(_ctx.$slots, "content")], 512), _cache[0] || (_cache[0] = vue.createTextVNode()), !props.disabled ? (vue.openBlock(), vue.createElementBlock("div", {
+        key: 0,
+        ref_key: "separator",
+        ref: separator,
+        role: "separator",
+        class: "resize__handle",
+        tabindex: "0",
+        "aria-orientation": orientation.value
+      }, null, 8, _hoisted_1$5)) : (vue.openBlock(), vue.createElementBlock("div", {
+        key: 1,
+        role: "separator",
+        class: "resize__handle disabled",
+        "aria-orientation": orientation.value
+      }, null, 8, _hoisted_2$2))], 2);
+    };
+  }
+});
+const _style_0 = '/* background color */\n/* highlight color */\n/* the width of the visible handle */\n/* how much extra click/hover area the handle has */\n/* how much extra space the handle occupies when hovering (not counting the click area) */\n/* how long before visually indicating the hover state */\n/* how long the animation for the visual indicator is */\n:host {\n  display: contents;\n}\n.resize {\n  flex-grow: 1;\n  display: flex;\n  align-items: stretch;\n}\n.resize--left {\n  flex-direction: row;\n  width: var(--size);\n}\n.resize--right {\n  flex-direction: row-reverse;\n  width: var(--size);\n}\n.resize--top {\n  flex-direction: column;\n  height: var(--size);\n}\n.resize--bottom {\n  flex-direction: column-reverse;\n  height: var(--size);\n}\n.resize__content {\n  flex: 1 1 auto;\n  overflow: auto;\n  box-sizing: border-box;\n  display: flex;\n}\n.resize--left .resize__content, .resize--right .resize__content {\n  min-width: calc(var(--min) - 2px);\n  max-width: calc(var(--max) - 2px);\n}\n.resize--top .resize__content, .resize--bottom .resize__content {\n  min-height: calc(var(--min) - 2px);\n  max-height: calc(var(--max) - 2px);\n}\n.resize__handle {\n  flex: 0 0 2px;\n  background: var(--fkds-color-border-primary);\n  touch-action: none;\n  user-select: none;\n  z-index: 1;\n  position: relative;\n  transition: z-index 0s 200ms;\n  /* disable regular focus indicator as this component has its own */\n  /* when focus by keyboard we dont want the delay or transition */\n  /* as the handle area expand we increase z-index for the handle to make sure it covers other separators */\n}\n@media (forced-colors: active) {\n.resize__handle {\n    background: CanvasText;\n}\n}\n.resize__handle[aria-orientation=horizontal] {\n  cursor: row-resize;\n  height: 2px;\n}\n.resize__handle[aria-orientation=horizontal]::before {\n  inset: -2px 0;\n}\n.resize__handle[aria-orientation=horizontal]::after {\n  inset: -4px 0;\n}\n.resize__handle[aria-orientation=vertical] {\n  cursor: col-resize;\n  width: 2px;\n}\n.resize__handle[aria-orientation=vertical]::before {\n  inset: 0 -2px;\n}\n.resize__handle[aria-orientation=vertical]::after {\n  inset: 0 -4px;\n}\n.resize__handle::before {\n  content: "";\n  pointer-events: none;\n  position: absolute;\n  background-color: transparent;\n  transition: background-color 200ms ease-in;\n}\n.resize__handle::after {\n  content: "";\n  position: absolute;\n}\n.resize__handle:focus::before, .resize__handle:hover::before, .resize__handle.drag::before {\n  background-color: var(--fkds-color-action-border-primary-hover);\n  transition-delay: 200ms;\n}\n@media (forced-colors: active) {\n.resize__handle:focus::before, .resize__handle:hover::before, .resize__handle.drag::before {\n    background-color: Highlight;\n}\n}\n.resize__handle:focus {\n  outline: none;\n  box-shadow: none;\n}\n.resize__handle:focus::before {\n  transition: none;\n}\n.resize__handle:hover, .resize__handle:focus, .resize__handle.drag {\n  z-index: 2;\n  transition: z-index 0s 0s;\n}\n.resize__handle.disabled {\n  cursor: auto;\n}\n.resize__handle.disabled::before {\n  display: none;\n}\n.resize--left .resize__handle {\n  left: 2px;\n}\n.resize--right .resize__handle {\n  right: 2px;\n}\n.resize--top .resize__handle {\n  top: 2px;\n}\n.resize--bottom .resize__handle {\n  bottom: 2px;\n}';
+const FResizePane = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["styles", [_style_0]]]);
+const _hoisted_1$4 = {
+  slot: "content"
+};
+const tagName = "ce-resize-pane";
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+  __name: "FResizePane",
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    min: {
+      default: "0"
+    },
+    max: {
+      default: "100%"
+    },
+    initial: {
+      default: "50%"
+    }
+  },
+  setup(__props) {
+    if (!customElements.get(tagName)) {
+      customElements.define(tagName, vue.defineCustomElement(FResizePane));
+    }
+    const props = __props;
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tagName), vue.normalizeProps(vue.guardReactiveProps(props)), {
+        default: vue.withCtx(() => [vue.createElementVNode("div", _hoisted_1$4, [vue.renderSlot(_ctx.$slots, "default")])]),
+        _: 3
+      }, 16);
+    };
+  }
+});
 const _sfc_main$3 = vue.defineComponent({
   name: "FStaticField",
   components: {
@@ -17622,20 +18087,20 @@ exports.ErrorData = ErrorData;
 exports.ErrorPlugin = ErrorPlugin;
 exports.ErrorViewData = ErrorViewData;
 exports.EventBus = EventBus;
-exports.FBadge = _sfc_main$1c;
-exports.FBankAccountNumberTextField = _sfc_main$z;
-exports.FBankgiroTextField = _sfc_main$y;
+exports.FBadge = _sfc_main$1e;
+exports.FBankAccountNumberTextField = _sfc_main$B;
+exports.FBankgiroTextField = _sfc_main$A;
 exports.FCalendar = FCalendar;
 exports.FCalendarDay = FCalendarDay;
-exports.FCard = _sfc_main$X;
+exports.FCard = _sfc_main$Z;
 exports.FCheckboxField = FCheckboxField;
-exports.FClearingnumberTextField = _sfc_main$x;
+exports.FClearingnumberTextField = _sfc_main$z;
 exports.FConfirmModal = FConfirmModal;
 exports.FContextMenu = FContextMenu;
 exports.FCrudButton = FCrudButton;
-exports.FCrudDataset = _sfc_main$J;
-exports.FCurrencyTextField = _sfc_main$B;
-exports.FDataTable = _sfc_main$p;
+exports.FCrudDataset = _sfc_main$L;
+exports.FCurrencyTextField = _sfc_main$D;
+exports.FDataTable = _sfc_main$r;
 exports.FDatepickerField = FDatepickerField;
 exports.FDialogueTree = FDialogueTree;
 exports.FEmailTextField = FEmailTextField;
@@ -17650,35 +18115,36 @@ exports.FFileSelector = FFileSelector;
 exports.FFormModal = FFormModal;
 exports.FFormModalAction = FValidationFormAction;
 exports.FIcon = FIcon;
-exports.FInteractiveTable = _sfc_main$i;
+exports.FInteractiveTable = _sfc_main$k;
 exports.FKUIConfigButtonOrder = FKUIConfigButtonOrder;
 exports.FLabel = FLabel;
 exports.FLayoutApplicationTemplate = FLayoutApplicationTemplate;
 exports.FLayoutLeftPanel = FLayoutLeftPanel;
 exports.FLayoutRightPanel = FLayoutRightPanel;
 exports.FLayoutRightPanelService = FLayoutRightPanelService;
-exports.FList = _sfc_main$e;
+exports.FList = _sfc_main$g;
 exports.FLoader = FLoader;
-exports.FLogo = _sfc_main$c;
+exports.FLogo = _sfc_main$e;
 exports.FMessageBox = FMessageBox;
 exports.FModal = FModal;
 exports.FNavigationMenu = FNavigationMenu;
-exports.FNumericTextField = _sfc_main$w;
+exports.FNumericTextField = _sfc_main$y;
 exports.FOffline = FOffline;
-exports.FOrganisationsnummerTextField = _sfc_main$r;
+exports.FOrganisationsnummerTextField = _sfc_main$t;
 exports.FOutputField = FOutputField;
 exports.FPageHeader = FPageHeader;
-exports.FPageLayout = _sfc_main$6;
-exports.FPercentTextField = _sfc_main$s;
-exports.FPersonnummerTextField = _sfc_main$v;
+exports.FPageLayout = _sfc_main$8;
+exports.FPercentTextField = _sfc_main$u;
+exports.FPersonnummerTextField = _sfc_main$x;
 exports.FPhoneTextField = FPhoneTextField;
-exports.FPlusgiroTextField = _sfc_main$u;
-exports.FPostalCodeTextField = _sfc_main$t;
-exports.FProgressbar = _sfc_main$5;
+exports.FPlusgiroTextField = _sfc_main$w;
+exports.FPostalCodeTextField = _sfc_main$v;
+exports.FProgressbar = _sfc_main$7;
 exports.FRadioField = FRadioField;
+exports.FResizePane = _sfc_main$4;
 exports.FSearchTextField = FSearchTextField;
 exports.FSelectField = FSelectField;
-exports.FSortFilterDataset = _sfc_main$q;
+exports.FSortFilterDataset = _sfc_main$s;
 exports.FSortFilterDatasetInjected = FSortFilterDatasetInjected;
 exports.FStaticField = FStaticField;
 exports.FTableColumn = FTableColumn;
@@ -17699,13 +18165,13 @@ exports.IAnimateExpand = IAnimateExpand;
 exports.ICalendarMonth = ICalendarMonth;
 exports.ICalendarMonthGrid = ICalendarMonthGrid;
 exports.ICalendarNavbar = ICalendarNavbar;
-exports.IComboboxDropdown = _sfc_main$P;
-exports.IComboboxToggleButton = _sfc_main$O;
+exports.IComboboxDropdown = _sfc_main$R;
+exports.IComboboxToggleButton = _sfc_main$Q;
 exports.IFlex = IFlex;
 exports.IFlexItem = IFlexItem;
 exports.IPopup = IPopup;
 exports.IPopupError = IPopupError;
-exports.IPopupListbox = _sfc_main$T;
+exports.IPopupListbox = _sfc_main$V;
 exports.IPopupMenu = IPopupMenu;
 exports.ISkipLink = ISkipLink;
 exports.IValidationForm = FValidationForm;