@fkui/vue 6.4.0 → 6.5.0

package/dist/esm/index.esm.js

@@ -4614,7 +4614,7 @@ const _hoisted_5$l = {
 const _hoisted_6$g = {
   class: "modal__header"
 };
-const _hoisted_7$d = {
+const _hoisted_7$c = {
   key: 0,
   ref: "modalTitle",
   class: "modal__title",
@@ -4650,7 +4650,7 @@ function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
   }, [createElementVNode("div", _hoisted_4$q, [createElementVNode("div", _hoisted_5$l, [createElementVNode("div", _hoisted_6$g, [createElementVNode("div", {
     tabindex: "0",
     onFocus: _cache[0] || (_cache[0] = (...args) => _ctx.onFocusFirst && _ctx.onFocusFirst(...args))
-  }, null, 32), _cache[4] || (_cache[4] = createTextVNode()), _ctx.hasHeaderSlot ? (openBlock(), createElementBlock("h1", _hoisted_7$d, [renderSlot(_ctx.$slots, "header")], 512)) : createCommentVNode("", true)]), _cache[5] || (_cache[5] = createTextVNode()), createElementVNode("div", _hoisted_8$8, [renderSlot(_ctx.$slots, "content")], 512), _cache[6] || (_cache[6] = createTextVNode()), createElementVNode("div", _hoisted_9$6, [renderSlot(_ctx.$slots, "footer")])]), _cache[9] || (_cache[9] = createTextVNode()), createElementVNode("div", _hoisted_10$3, [createElementVNode("button", {
+  }, null, 32), _cache[4] || (_cache[4] = createTextVNode()), _ctx.hasHeaderSlot ? (openBlock(), createElementBlock("h1", _hoisted_7$c, [renderSlot(_ctx.$slots, "header")], 512)) : createCommentVNode("", true)]), _cache[5] || (_cache[5] = createTextVNode()), createElementVNode("div", _hoisted_8$8, [renderSlot(_ctx.$slots, "content")], 512), _cache[6] || (_cache[6] = createTextVNode()), createElementVNode("div", _hoisted_9$6, [renderSlot(_ctx.$slots, "footer")])]), _cache[9] || (_cache[9] = createTextVNode()), createElementVNode("div", _hoisted_10$3, [createElementVNode("button", {
     type: "button",
     class: "close-button",
     "aria-label": _ctx.ariaCloseText,
@@ -4663,8 +4663,8 @@ function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
   }, null, 32)])])], 2)])], 32)])], 10, _hoisted_1$W)) : createCommentVNode("", true);
 }
 const FModal = /* @__PURE__ */ _export_sfc(_sfc_main$1c, [["render", _sfc_render$P]]);
-function prepareButtonList(src, buttonOrder = config.buttonOrder) {
-  const list = src.map((it) => {
+function prepareButtonList(src) {
+  return src.map((it) => {
     var _it$event, _ref, _it$reason, _it$type;
     return {
       label: it.label,
@@ -4675,12 +4675,6 @@ function prepareButtonList(src, buttonOrder = config.buttonOrder) {
       buttonType: it.submitButton ? "submit" : "button"
     };
   });
-  switch (buttonOrder) {
-    case FKUIConfigButtonOrder.LEFT_TO_RIGHT:
-      return list;
-    case FKUIConfigButtonOrder.RIGHT_TO_LEFT:
-      return list.reverse();
-  }
 }
 const defaultButtons = [{
   label: "Primärknapp",
@@ -4778,7 +4772,8 @@ const _sfc_main$1b = defineComponent({
   })],
   computed: {
     preparedButtons() {
-      return prepareButtonList(this.buttons);
+      const preparedButtonList = prepareButtonList(this.buttons);
+      return config.buttonOrder === FKUIConfigButtonOrder.RIGHT_TO_LEFT ? preparedButtonList.reverse() : preparedButtonList;
     }
   },
   methods: {
@@ -5567,7 +5562,7 @@ const _sfc_main$15 = defineComponent({
   },
   computed: {
     preparedButtons() {
-      return prepareButtonList(this.buttons, FKUIConfigButtonOrder.RIGHT_TO_LEFT);
+      return prepareButtonList(this.buttons);
     }
   },
   methods: {
@@ -6356,7 +6351,7 @@ const _hoisted_6$e = {
   class: "calendar-month__cell calendar-month__cell--week-number",
   "aria-hidden": "true"
 };
-const _hoisted_7$c = ["colspan"];
+const _hoisted_7$b = ["colspan"];
 const _hoisted_8$7 = ["colspan"];
 const _hoisted_9$5 = {
   key: 0,
@@ -6406,7 +6401,7 @@ function _sfc_render$E(_ctx, _cache, $props, $setup, $data, $options) {
       key: 1,
       class: "calendar-month__cell",
       colspan: _ctx.getDayStartOffset(week.days)
-    }, null, 8, _hoisted_7$c)) : createCommentVNode("", true), _cache[18] || (_cache[18] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(week.days, (day) => {
+    }, null, 8, _hoisted_7$b)) : createCommentVNode("", true), _cache[18] || (_cache[18] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(week.days, (day) => {
       return openBlock(), createElementBlock("td", {
         key: day.toString(),
         class: "calendar-month__cell",
@@ -9498,7 +9493,7 @@ const _hoisted_5$f = {
 const _hoisted_6$c = {
   key: 1
 };
-const _hoisted_7$b = {
+const _hoisted_7$a = {
   ref: "tooltipAttachTo",
   class: "label"
 };
@@ -9529,7 +9524,7 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
     name: "error"
   }), createTextVNode(" " + toDisplayString(_ctx.validity.validationMessage), 1)])) : createCommentVNode("", true)])], 2)), _cache[7] || (_cache[7] = createTextVNode()), _ctx.hasCheckbox ? (openBlock(), createElementBlock("span", _hoisted_4$j, [_ctx.children.length === 1 ? (openBlock(), createElementBlock("span", _hoisted_5$f, toDisplayString(_ctx.checkboxCheckedScreenReaderText), 1)) : (openBlock(), createElementBlock("span", _hoisted_6$c, toDisplayString(_ctx.numberOfCheckedCheckboxesScreenText), 1))])) : createCommentVNode("", true), _cache[8] || (_cache[8] = createTextVNode()), _ctx.hasTooltipSlot ? (openBlock(), createElementBlock(Fragment, {
     key: 1
-  }, [createElementVNode("div", _hoisted_7$b, [createElementVNode("span", _hoisted_8$6, [renderSlot(_ctx.$slots, "label")])], 512), _cache[5] || (_cache[5] = createTextVNode()), renderSlot(_ctx.$slots, "tooltip"), _cache[6] || (_cache[6] = createTextVNode()), _ctx.hasDescriptionSlot || _ctx.hasErrorMessageSlot || _ctx.hasError ? (openBlock(), createElementBlock("div", {
+  }, [createElementVNode("div", _hoisted_7$a, [createElementVNode("span", _hoisted_8$6, [renderSlot(_ctx.$slots, "label")])], 512), _cache[5] || (_cache[5] = createTextVNode()), renderSlot(_ctx.$slots, "tooltip"), _cache[6] || (_cache[6] = createTextVNode()), _ctx.hasDescriptionSlot || _ctx.hasErrorMessageSlot || _ctx.hasError ? (openBlock(), createElementBlock("div", {
     key: 0,
     class: normalizeClass(["label", _ctx.groupLabelClass]),
     "aria-hidden": "true"
@@ -11047,13 +11042,19 @@ var FTableColumnSort = /* @__PURE__ */ ((FTableColumnSort2) => {
   return FTableColumnSort2;
 })(FTableColumnSort || {});
 function addColumn(src, column) {
-  if (!src.some((col) => col.name === column.name)) {
+  if (column.name) {
+    const hasDuplicateName = src.some((it) => it.name === column.name);
+    if (hasDuplicateName) {
+      throw new Error(`Expected FTableColumn to have a unique name but encountered duplicate of "${column.name}"`);
+    }
+  }
+  if (!src.some((col) => col.id === column.id)) {
     return [...src, column];
   }
   return src;
 }
 function setVisibilityColumn(src, id, visible) {
-  const column = src.find((col) => col.name === id);
+  const column = src.find((col) => col.id === id);
   if (column) {
     column.visible = visible;
   }
@@ -11112,14 +11113,14 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
   __name: "FTableColumn",
   props: {
     /**
-     * Unique (per-table) identifier.
+     * Unique (per-table) identifier. Typically set to the row
+     * property displayed but any unique string can be used.
      *
-     * Typically set to the row property displayed but any unique string can
-     * be used.
+     * Only required when used with `FSortFilterDataset`.
      */
     name: {
       type: String,
-      required: true
+      default: void 0
     },
     /**
      * If set to true, display the column, set to false to hide it.
@@ -11202,6 +11203,10 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
       setVisibilityColumn: setVisibilityColumn2,
       addColumn: addColumn2
     } = FTableInjected();
+    const internalVisible = ref(true);
+    const renderElement = ref(true);
+    const id = ElementIdService.generateElementId("column");
+    const el = useTemplateRef("element");
     const props = __props;
     const classes = computed(() => {
       return ["table__column", `table__column--${props.type}`];
@@ -11216,33 +11221,51 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
         return "td";
       }
     });
-    watch(() => props.visible, () => setVisibilityColumn2(props.name, props.visible));
+    watch(() => props.visible, () => {
+      internalVisible.value = props.visible;
+      setVisibilityColumn2(id, props.visible);
+    });
     onMounted(() => {
       if (props.shrink && props.expand) {
         throw new Error("Table cannot have both shrink and expand enabled at the same time");
       }
       const size = props.shrink ? FTableColumnSize.SHRINK : FTableColumnSize.EXPAND;
-      addColumn2({
-        name: props.name,
-        title: props.title,
-        description: props.description || void 0,
-        id: ElementIdService.generateElementId("column"),
-        size,
-        type: props.type,
-        visible: props.visible,
-        sortable: false,
-        sort: FTableColumnSort.UNSORTED
-      });
+      const header = isHeader();
+      if (header) {
+        addColumn2({
+          name: props.name,
+          title: props.title,
+          description: props.description || void 0,
+          id,
+          size,
+          type: props.type,
+          visible: props.visible,
+          sortable: false,
+          sort: FTableColumnSort.UNSORTED
+        });
+      }
+      renderElement.value = renderColumns && !header;
+      internalVisible.value = props.visible;
     });
+    function isHeader() {
+      if (!el.value || !(el.value instanceof HTMLElement)) {
+        return false;
+      }
+      const closest = el.value.closest("thead, tbody");
+      return (closest == null ? void 0 : closest.tagName) === "THEAD";
+    }
     return (_ctx, _cache) => {
-      return unref(renderColumns) && __props.visible ? (openBlock(), createBlock(resolveDynamicComponent(tagName2.value), mergeProps({
+      return renderElement.value && internalVisible.value ? (openBlock(), createBlock(resolveDynamicComponent(tagName2.value), mergeProps({
         key: 0,
+        ref: "element",
         class: classes.value,
         scope: scope.value
       }, _ctx.$attrs), {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default"), _cache[0] || (_cache[0] = createTextVNode()), _cache[1] || (_cache[1] = createElementVNode("span", {
+        default: withCtx(() => [unref(renderColumns) ? (openBlock(), createElementBlock(Fragment, {
+          key: 0
+        }, [renderSlot(_ctx.$slots, "default"), _cache[0] || (_cache[0] = createTextVNode()), _cache[1] || (_cache[1] = createElementVNode("span", {
           class: "sr-only"
-        }, " ", -1))]),
+        }, " ", -1))], 64)) : createCommentVNode("", true)]),
         _: 3
       }, 16, ["class", "scope"])) : createCommentVNode("", true);
     };
@@ -11308,7 +11331,7 @@ const _hoisted_5$d = {
   class: "label__message label__message--error"
 };
 const _hoisted_6$b = ["for"];
-const _hoisted_7$a = {
+const _hoisted_7$9 = {
   key: 0,
   class: "label__message label__message--error"
 };
@@ -11334,7 +11357,7 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
   }, [renderSlot(_ctx.$slots, "default"), _cache[5] || (_cache[5] = createTextVNode()), renderSlot(_ctx.$slots, "description", {
     descriptionClass: _ctx.descriptionClass,
     formatDescriptionClass: _ctx.formatDescriptionClass
-  }), _cache[6] || (_cache[6] = createTextVNode()), _ctx.hasErrorMessageSlot ? (openBlock(), createElementBlock("span", _hoisted_7$a, [createVNode(_component_f_icon, {
+  }), _cache[6] || (_cache[6] = createTextVNode()), _ctx.hasErrorMessageSlot ? (openBlock(), createElementBlock("span", _hoisted_7$9, [createVNode(_component_f_icon, {
     class: "label__icon--left",
     name: "error"
   }), _cache[4] || (_cache[4] = createTextVNode()), renderSlot(_ctx.$slots, "error-message")])) : createCommentVNode("", true)], 8, _hoisted_6$b));
@@ -11924,7 +11947,7 @@ const _hoisted_6$a = {
   key: 2,
   class: "text-field__append-inner"
 };
-const _hoisted_7$9 = {
+const _hoisted_7$8 = {
   key: 3,
   class: "text-field__append-inner"
 };
@@ -11994,7 +12017,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
     "is-open": _ctx.showPopupError,
     "error-message": _ctx.validationMessage,
     onClose: _ctx.closePopupError
-  }, null, 8, ["anchor", "is-open", "error-message", "onClose"])) : createCommentVNode("", true), _cache[15] || (_cache[15] = createTextVNode()), _ctx.$slots["append-inner"] ? (openBlock(), createElementBlock("div", _hoisted_6$a, [renderSlot(_ctx.$slots, "append-inner")])) : createCommentVNode("", true), _cache[16] || (_cache[16] = createTextVNode()), _ctx.options ? (openBlock(), createElementBlock("div", _hoisted_7$9, [createVNode(_component_i_combobox_toggle_button, {
+  }, null, 8, ["anchor", "is-open", "error-message", "onClose"])) : createCommentVNode("", true), _cache[15] || (_cache[15] = createTextVNode()), _ctx.$slots["append-inner"] ? (openBlock(), createElementBlock("div", _hoisted_6$a, [renderSlot(_ctx.$slots, "append-inner")])) : createCommentVNode("", true), _cache[16] || (_cache[16] = createTextVNode()), _ctx.options ? (openBlock(), createElementBlock("div", _hoisted_7$8, [createVNode(_component_i_combobox_toggle_button, {
     disabled: _ctx.disabled,
     "aria-controls": _ctx.dropdownIsOpen ? _ctx.dropdownId : void 0,
     "aria-expanded": _ctx.dropdownIsOpen,
@@ -12849,13 +12872,7 @@ const _hoisted_4$e = ["title"];
 const _hoisted_5$b = {
   class: "sr-only"
 };
-const _hoisted_6$9 = {
-  value: {
-    attribute: "",
-    ascending: false
-  }
-};
-const _hoisted_7$8 = ["value"];
+const _hoisted_6$9 = ["value"];
 const _sfc_main$s = /* @__PURE__ */ defineComponent({
   __name: "FSortFilterDataset",
   props: {
@@ -12923,13 +12940,14 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
   }) {
     const $t2 = useTranslate();
     const searchString = ref("");
-    const sortAttribute = ref({
+    const defaultSortValue = {
       attribute: "",
       name: "",
       ascendingName: "",
       ascending: false,
       id: 0
-    });
+    };
+    const sortAttribute = ref(defaultSortValue);
     const sortFilterResult = ref([]);
     const debouncedFilterResultset = debounce(filterResultset, 250);
     let tableCallbackOnSort = () => {
@@ -13104,11 +13122,13 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
                 onChange: onChangeSortAttribute
               }, {
                 label: withCtx(() => [createTextVNode(toDisplayString(unref($t2)("fkui.sort-filter-dataset.label.sort", "Sortera på")), 1)]),
-                default: withCtx(() => [_cache[5] || (_cache[5] = createTextVNode()), createElementVNode("option", _hoisted_6$9, toDisplayString(unref($t2)("fkui.sort-filter-dataset.label.unsorted", "Välj")), 1), _cache[6] || (_cache[6] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(sortOrders.value, (sortOrder) => {
+                default: withCtx(() => [_cache[5] || (_cache[5] = createTextVNode()), createElementVNode("option", {
+                  value: defaultSortValue
+                }, toDisplayString(unref($t2)("fkui.sort-filter-dataset.label.unsorted", "Välj")), 1), _cache[6] || (_cache[6] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(sortOrders.value, (sortOrder) => {
                   return openBlock(), createElementBlock("option", {
                     key: sortOrder.id,
                     value: sortOrder
-                  }, toDisplayString(sortOrder.name) + " (" + toDisplayString(sortOrder.ascendingName) + ")\n                            ", 9, _hoisted_7$8);
+                  }, toDisplayString(sortOrder.name) + " (" + toDisplayString(sortOrder.ascendingName) + ")\n                            ", 9, _hoisted_6$9);
                 }), 128))]),
                 _: 1
               }, 8, ["modelValue"])]),
@@ -13276,6 +13296,9 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
         return;
       }
       let columnName = column.name;
+      if (!columnName) {
+        throw new Error("`FTableColumn` must have a unique `name` when used with `FSortFilterDataset`");
+      }
       if (column.sort === FTableColumnSort.DESCENDING) {
         columnName = "";
         column.sort = FTableColumnSort.UNSORTED;
@@ -13297,12 +13320,14 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
       }, [createElementVNode("table", mergeProps({
         class: ["table", tableClasses.value],
         tabindex: tabindex.value
-      }, _ctx.$attrs), [hasCaption.value ? (openBlock(), createElementBlock("caption", _hoisted_2$l, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), _cache[4] || (_cache[4] = createTextVNode()), createElementVNode("colgroup", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(columns.value, (column) => {
+      }, _ctx.$attrs), [hasCaption.value ? (openBlock(), createElementBlock("caption", _hoisted_2$l, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), _cache[5] || (_cache[5] = createTextVNode()), createElementVNode("colgroup", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(columns.value, (column) => {
         return openBlock(), createElementBlock("col", {
           key: column.id,
           class: normalizeClass(column.size)
         }, null, 2);
-      }), 128))]), _cache[5] || (_cache[5] = createTextVNode()), createElementVNode("thead", null, [createElementVNode("tr", _hoisted_3$h, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumns.value, (column) => {
+      }), 128))]), _cache[6] || (_cache[6] = createTextVNode()), createElementVNode("thead", null, [createElementVNode("tr", _hoisted_3$h, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
+        row: {}
+      }))), _cache[2] || (_cache[2] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumns.value, (column) => {
         return openBlock(), createElementBlock("th", mergeProps({
           key: column.id,
           scope: "col",
@@ -13316,12 +13341,12 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
           class: normalizeClass(iconClasses2(column)),
           name: iconName(column)
         }, null, 8, ["class", "name"])) : createCommentVNode("", true), _cache[1] || (_cache[1] = createTextVNode()), column.description ? (openBlock(), createElementBlock("span", _hoisted_5$a, toDisplayString(column.description), 1)) : createCommentVNode("", true)], 16);
-      }), 128))])]), _cache[6] || (_cache[6] = createTextVNode()), createElementVNode("tbody", null, [isEmpty2.value && columns.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_6$8, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
+      }), 128))])]), _cache[7] || (_cache[7] = createTextVNode()), createElementVNode("tbody", null, [isEmpty2.value && columns.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_6$8, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
         row: {}
-      })))])) : createCommentVNode("", true), _cache[2] || (_cache[2] = createTextVNode()), isEmpty2.value ? (openBlock(), createElementBlock("tr", _hoisted_7$7, [createElementVNode("td", {
+      })))])) : createCommentVNode("", true), _cache[3] || (_cache[3] = createTextVNode()), isEmpty2.value ? (openBlock(), createElementBlock("tr", _hoisted_7$7, [createElementVNode("td", {
         class: "table__column table__column--action",
         colspan: columns.value.length
-      }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(unref($t2)("fkui.data-table.empty", "Tabellen är tom")), 1)])], 8, _hoisted_8$5)])) : createCommentVNode("", true), _cache[3] || (_cache[3] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(internalRows.value, (row) => {
+      }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(unref($t2)("fkui.data-table.empty", "Tabellen är tom")), 1)])], 8, _hoisted_8$5)])) : createCommentVNode("", true), _cache[4] || (_cache[4] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(internalRows.value, (row) => {
         return openBlock(), createElementBlock("tr", {
           key: rowKey(row),
           class: "table__row"
@@ -14682,7 +14707,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
       expandableRows,
       hasExpandableContent
     } = expandableTable;
-    const tbodyElement = useTemplateRef("tbodyElement");
+    const tbody = useTemplateRef("tbodyElement");
     const hasCaption = computed(() => {
       return hasSlot2("caption", {}, {
         stripClasses: []
@@ -14764,21 +14789,21 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
       immediate: true,
       deep: true
     });
-    function updateTr(tbodyElement2) {
-      const trElements = [].slice.call(tbodyElement2.children);
+    function updateTr(tbodyElement) {
+      const trElements = [].slice.call(tbodyElement.children);
       const trInteractableElements = trElements.filter((tr2) => {
         return tr2.tabIndex === 0;
       });
       tr.value = trInteractableElements;
     }
     onUpdated(() => {
-      if (tbodyElement.value) {
-        updateTr(tbodyElement.value);
+      if (tbody.value) {
+        updateTr(tbody.value);
       }
     });
     onMounted(() => {
-      if (tbodyElement.value) {
-        updateTr(tbodyElement.value);
+      if (tbody.value) {
+        updateTr(tbody.value);
       }
       registerCallbackOnSort(callbackOnSort);
       registerCallbackOnMount(callbackSortableColumns);
@@ -14892,6 +14917,9 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
         return;
       }
       let columnName = column.name;
+      if (!columnName) {
+        throw new Error("`FTableColumn` must have a unique `name` when used with `FSortFilterDataset`");
+      }
       if (column.sort === FTableColumnSort.DESCENDING) {
         columnName = "";
         column.sort = FTableColumnSort.UNSORTED;
@@ -14936,15 +14964,17 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(wrapperClasses.value)
-      }, [createCommentVNode("", true), _cache[18] || (_cache[18] = createTextVNode()), createElementVNode("table", mergeProps({
+      }, [createCommentVNode("", true), _cache[19] || (_cache[19] = createTextVNode()), createElementVNode("table", mergeProps({
         class: ["table", tableClasses.value],
         role: tableRole.value
-      }, _ctx.$attrs), [hasCaption.value ? (openBlock(), createElementBlock("caption", _hoisted_2$e, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), _cache[15] || (_cache[15] = createTextVNode()), createElementVNode("colgroup", null, [unref(isExpandableTable) ? (openBlock(), createElementBlock("col", _hoisted_3$a)) : createCommentVNode("", true), _cache[0] || (_cache[0] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("col", _hoisted_4$8)) : createCommentVNode("", true), _cache[1] || (_cache[1] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(columns.value, (column) => {
+      }, _ctx.$attrs), [hasCaption.value ? (openBlock(), createElementBlock("caption", _hoisted_2$e, [renderSlot(_ctx.$slots, "caption")])) : createCommentVNode("", true), _cache[16] || (_cache[16] = createTextVNode()), createElementVNode("colgroup", null, [unref(isExpandableTable) ? (openBlock(), createElementBlock("col", _hoisted_3$a)) : createCommentVNode("", true), _cache[0] || (_cache[0] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("col", _hoisted_4$8)) : createCommentVNode("", true), _cache[1] || (_cache[1] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(columns.value, (column) => {
         return openBlock(), createElementBlock("col", {
           key: column.id,
           class: normalizeClass(column.size)
         }, null, 2);
-      }), 128))]), _cache[16] || (_cache[16] = createTextVNode()), createElementVNode("thead", null, [createElementVNode("tr", _hoisted_5$6, [unref(isExpandableTable) ? (openBlock(), createElementBlock("th", _hoisted_6$4, [createElementVNode("span", _hoisted_7$3, toDisplayString(unref($t2)("fkui.interactive-table.select", "Expandera")), 1)])) : createCommentVNode("", true), _cache[4] || (_cache[4] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("th", _hoisted_8$3, [createElementVNode("span", _hoisted_9$3, toDisplayString(unref($t2)("fkui.interactive-table.select", "Markera")), 1)])) : createCommentVNode("", true), _cache[5] || (_cache[5] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumns.value, (column) => {
+      }), 128))]), _cache[17] || (_cache[17] = createTextVNode()), createElementVNode("thead", null, [createElementVNode("tr", _hoisted_5$6, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
+        row: {}
+      }))), _cache[4] || (_cache[4] = createTextVNode()), unref(isExpandableTable) ? (openBlock(), createElementBlock("th", _hoisted_6$4, [createElementVNode("span", _hoisted_7$3, toDisplayString(unref($t2)("fkui.interactive-table.select", "Expandera")), 1)])) : createCommentVNode("", true), _cache[5] || (_cache[5] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("th", _hoisted_8$3, [createElementVNode("span", _hoisted_9$3, toDisplayString(unref($t2)("fkui.interactive-table.select", "Markera")), 1)])) : createCommentVNode("", true), _cache[6] || (_cache[6] = createTextVNode()), (openBlock(true), createElementBlock(Fragment, null, renderList(visibleColumns.value, (column) => {
         return openBlock(), createElementBlock("th", mergeProps({
           key: column.id,
           scope: "col",
@@ -14958,9 +14988,8 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
           class: normalizeClass(iconClasses2(column)),
           name: iconName(column)
         }, null, 8, ["class", "name"])) : createCommentVNode("", true), _cache[3] || (_cache[3] = createTextVNode()), column.description ? (openBlock(), createElementBlock("span", _hoisted_11$1, toDisplayString(column.description), 1)) : createCommentVNode("", true)], 16);
-      }), 128))])]), _cache[17] || (_cache[17] = createTextVNode()), (openBlock(), createElementBlock("tbody", {
-        ref_key: "tbodyElement",
-        ref: tbodyElement,
+      }), 128))])]), _cache[18] || (_cache[18] = createTextVNode()), (openBlock(), createElementBlock("tbody", {
+        ref: "tbodyElement",
         key: tbodyKey.value
       }, [(openBlock(true), createElementBlock(Fragment, null, renderList(internalRows.value, (row, index) => {
         return openBlock(), createElementBlock(Fragment, {
@@ -14977,7 +15006,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
         }, [unref(isExpandableTable) ? (openBlock(), createElementBlock("td", _hoisted_13, [unref(hasExpandableContent)(row) ? (openBlock(), createElementBlock("div", _hoisted_14, [createVNode(unref(FIcon), {
           name: "arrow-right",
           rotate: unref(isExpanded)(row) ? "270" : "90"
-        }, null, 8, ["rotate"])])) : createCommentVNode("", true)])) : createCommentVNode("", true), _cache[6] || (_cache[6] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("td", _hoisted_15, [createElementVNode("div", _hoisted_16, [createVNode(unref(FCheckboxField), {
+        }, null, 8, ["rotate"])])) : createCommentVNode("", true)])) : createCommentVNode("", true), _cache[7] || (_cache[7] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("td", _hoisted_15, [createElementVNode("div", _hoisted_16, [createVNode(unref(FCheckboxField), {
           value: true,
           "model-value": isSelected(row),
           onClick: withModifiers(($event) => onSelect(row), ["self"])
@@ -14988,20 +15017,20 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
             row
           }))])) : createCommentVNode("", true)]),
           _: 2
-        }, 1032, ["model-value", "onClick"])])])) : createCommentVNode("", true), _cache[7] || (_cache[7] = createTextVNode()), renderSlot(_ctx.$slots, "default", mergeProps({
+        }, 1032, ["model-value", "onClick"])])])) : createCommentVNode("", true), _cache[8] || (_cache[8] = createTextVNode()), renderSlot(_ctx.$slots, "default", mergeProps({
           ref_for: true
         }, {
           row
-        }))], 42, _hoisted_12$1), _cache[11] || (_cache[11] = createTextVNode()), unref(isExpandableTable) && unref(hasExpandableContent)(row) ? (openBlock(true), createElementBlock(Fragment, {
+        }))], 42, _hoisted_12$1), _cache[12] || (_cache[12] = createTextVNode()), unref(isExpandableTable) && unref(hasExpandableContent)(row) ? (openBlock(true), createElementBlock(Fragment, {
           key: 0
         }, renderList(unref(expandableRows)(row), (expandableRow, expandableIndex) => {
           return openBlock(), createElementBlock("tr", {
             key: rowKey(expandableRow),
             "aria-level": "2",
             class: normalizeClass(unref(expandableRowClasses)(row, expandableIndex))
-          }, [_cache[8] || (_cache[8] = createElementVNode("td", {
+          }, [_cache[9] || (_cache[9] = createElementVNode("td", {
             class: "table__column--placeholder"
-          }, null, -1)), _cache[9] || (_cache[9] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("td", _hoisted_18)) : createCommentVNode("", true), _cache[10] || (_cache[10] = createTextVNode()), !unref(hasExpandableSlot) ? renderSlot(_ctx.$slots, "default", mergeProps({
+          }, null, -1)), _cache[10] || (_cache[10] = createTextVNode()), __props.selectable ? (openBlock(), createElementBlock("td", _hoisted_18)) : createCommentVNode("", true), _cache[11] || (_cache[11] = createTextVNode()), !unref(hasExpandableSlot) ? renderSlot(_ctx.$slots, "default", mergeProps({
             key: 1,
             ref_for: true
           }, {
@@ -15017,12 +15046,12 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
             parentRow: row
           }))], 8, _hoisted_19))], 2);
         }), 128)) : createCommentVNode("", true)], 64);
-      }), 128)), _cache[13] || (_cache[13] = createTextVNode()), isEmpty2.value && columns.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_20, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
+      }), 128)), _cache[14] || (_cache[14] = createTextVNode()), isEmpty2.value && columns.value.length === 0 ? (openBlock(), createElementBlock("tr", _hoisted_20, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
         row: {}
-      })))])) : createCommentVNode("", true), _cache[14] || (_cache[14] = createTextVNode()), isEmpty2.value ? (openBlock(), createElementBlock("tr", _hoisted_21, [createElementVNode("td", {
+      })))])) : createCommentVNode("", true), _cache[15] || (_cache[15] = createTextVNode()), isEmpty2.value ? (openBlock(), createElementBlock("tr", _hoisted_21, [createElementVNode("td", {
         class: "table__column table__column--action",
         colspan: nbOfColumns.value
-      }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(unref($t2)("fkui.interactive-table.empty", "Tabellen är tom")), 1)])], 8, _hoisted_22), _cache[12] || (_cache[12] = createTextVNode()), renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
+      }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(unref($t2)("fkui.interactive-table.empty", "Tabellen är tom")), 1)])], 8, _hoisted_22), _cache[13] || (_cache[13] = createTextVNode()), renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({
         row: {}
       })))])) : createCommentVNode("", true)]))], 16, _hoisted_1$k)], 2);
     };