@robuust-digital/vue-components 2.5.0 → 2.6.1

package/CHANGELOG.md

@@ -1,3 +1,23 @@
+## 2.6.1 (14-04-2026)
+
+### Fixed
+
+* `DataTable`: Move the `tbody` slot to a body-level override so consumers can render a custom `<tbody>` without nested `<tbody>` markup
+
+### Updated
+
+* `DataTable` docs: Clarified that `#tbody` should return valid body markup (typically `<tbody>...</tbody>`)
+
+## 2.6.0 (14-04-2026)
+
+### Added
+
+* `DataTable`: Added optional `tbody` slot (`#tbody="{ items }"`) for full loaded-state tbody customization
+
+### Updated
+
+* `DataTable` docs: Documented `tbody` slot and clarified that consumers own row markup when using it
+
 ## 2.5.0 (14-04-2026)
 
 ### Added

package/dist/_shared/{Tabs.vue_vue_type_script_setup_true_lang-B0RIqYLz.js → Tabs.vue_vue_type_script_setup_true_lang-CLF0EEY-.js}

@@ -1,4 +1,4 @@
-import { openBlock as l, createElementBlock as n, createElementVNode as u, defineComponent as w, Fragment as k, renderList as V, renderSlot as c, createTextVNode as x, toDisplayString as g, createVNode as I, unref as h, normalizeClass as p, createBlock as C, resolveDynamicComponent as P, withCtx as O, createCommentVNode as $, computed as B, useAttrs as A, ref as S, withDirectives as M, mergeProps as y, vModelDynamic as F, normalizeProps as j, guardReactiveProps as E, vModelSelect as H, vModelText as D } from "vue";
+import { openBlock as l, createElementBlock as n, createElementVNode as u, defineComponent as w, Fragment as k, renderList as V, renderSlot as c, createTextVNode as S, toDisplayString as g, createVNode as I, unref as h, normalizeClass as p, createBlock as C, resolveDynamicComponent as P, withCtx as O, createCommentVNode as $, computed as B, useAttrs as A, ref as x, withDirectives as M, mergeProps as y, vModelDynamic as F, normalizeProps as j, guardReactiveProps as E, vModelSelect as H, vModelText as D } from "vue";
 import { r as R } from "./XMarkIcon-CPr_Rd8y.js";
 import { u as T } from "./FormInput.vue_vue_type_script_setup_true_lang-Bg7YPGyY.js";
 import { S as U } from "./icon-spinner-BYCMrTdL.js";
@@ -53,7 +53,7 @@ const G = { class: "rvc-accordion" }, J = ["open", "name"], Q = ["innerHTML"], M
             item: f,
             index: s
           }, () => [
-            x(g(f.title) + " ", 1),
+            S(g(f.title) + " ", 1),
             c(r.$slots, "icon", { classList: "rvc-accordion-icon" }, () => [
               I(h(q), { class: "rvc-accordion-icon" })
             ])
@@ -134,7 +134,7 @@ const G = { class: "rvc-accordion" }, J = ["open", "name"], Q = ["innerHTML"], M
     }), { hasModelBinding: d } = T(), m = A(), a = B(() => ({
       ...m,
       type: "checkbox"
-    })), o = S(null);
+    })), o = x(null);
     return (t, i) => (l(), n("label", {
       class: p(["rvc-checkbox", e.rootClass])
     }, [
@@ -222,7 +222,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
     const v = e, f = r, s = B({
       get: () => v.modelValue,
       set: (a) => f("update:modelValue", a)
-    }), { hasModelBinding: d } = T(), m = S(null);
+    }), { hasModelBinding: d } = T(), m = x(null);
     return (a, o) => (l(), n("div", {
       class: p([
         "rvc-select",
@@ -355,7 +355,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
       ])
     ])) : $("", !0);
   }
-}), ve = { key: 0 }, fe = ["aria-label", "onClick"], ge = ["innerHTML"], be = { key: 1 }, me = ["colspan"], pe = { key: 2 }, ye = ["colspan"], $e = { class: "rvc-table-spinner-wrapper" }, he = { key: 1 }, Fe = /* @__PURE__ */ w({
+}), ve = { key: 0 }, fe = ["aria-label", "onClick"], ge = ["innerHTML"], be = { key: 2 }, me = ["colspan"], pe = { key: 3 }, ye = ["colspan"], $e = { class: "rvc-table-spinner-wrapper" }, he = { key: 4 }, Fe = /* @__PURE__ */ w({
   __name: "DataTable",
   props: {
     headers: { default: () => [] },
@@ -376,7 +376,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
   },
   emits: ["table:sortBy", "pagination:change", "pagination:perPage"],
   setup(e, { emit: r }) {
-    const v = e, f = r, s = S(v.defaultSort), d = (a) => v.headers.find((o) => o.key === a), m = (a) => {
+    const v = e, f = r, s = x(v.defaultSort), d = (a) => v.headers.find((o) => o.key === a), m = (a) => {
       a.key && (!s.value || s.value.key !== a.key ? s.value = {
         key: a.key,
         direction: "asc"
@@ -424,7 +424,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
                         sortBy: s.value,
                         header: t
                       }, () => [
-                        x(g(t.label), 1)
+                        S(g(t.label), 1)
                       ]),
                       I(h(_), {
                         class: p([
@@ -441,45 +441,54 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
                       sortBy: s.value,
                       header: t
                     }, () => [
-                      x(g(t.label), 1)
+                      S(g(t.label), 1)
                     ])
                   ], 16))
                 ])), 256))
               ])
             ])
           ])) : $("", !0),
-          u("tbody", null, [
-            e.items.length && !e.spinning ? (l(!0), n(k, { key: 0 }, V(e.items, (t, i) => c(a.$slots, "items", {
-              item: t,
-              index: i
-            }, () => [
-              (l(), n("tr", {
-                key: `rvc-table-row-${i}-${t.id}`
-              }, [
-                c(a.$slots, "item", {
-                  item: t,
-                  index: i
-                }, () => [
-                  (l(!0), n(k, null, V(t, (b, L) => (l(), n("td", y({
-                    key: `rvc-table-row-${i}-column-${L}-${t.id}`
-                  }, { ref_for: !0 }, t.attrs, {
-                    class: {
-                      "rvc-table-text-left": d(String(L))?.align === "left" || !d(String(L))?.align,
-                      "rvc-table-text-center": d(String(L))?.align === "center",
-                      "rvc-table-text-right": d(String(L))?.align === "right"
-                    },
-                    innerHTML: b
-                  }), null, 16, ge))), 128))
-                ])
-              ]))
-            ])), 256)) : !e.items.length && !e.spinning ? (l(), n("tr", be, [
+          e.items.length && !e.spinning ? c(a.$slots, "tbody", {
+            key: 1,
+            items: e.items
+          }, () => [
+            u("tbody", null, [
+              (l(!0), n(k, null, V(e.items, (t, i) => c(a.$slots, "items", {
+                item: t,
+                index: i
+              }, () => [
+                (l(), n("tr", {
+                  key: `rvc-table-row-${i}-${t.id}`
+                }, [
+                  c(a.$slots, "item", {
+                    item: t,
+                    index: i
+                  }, () => [
+                    (l(!0), n(k, null, V(t, (b, L) => (l(), n("td", y({
+                      key: `rvc-table-row-${i}-column-${L}-${t.id}`
+                    }, { ref_for: !0 }, t.attrs, {
+                      class: {
+                        "rvc-table-text-left": d(String(L))?.align === "left" || !d(String(L))?.align,
+                        "rvc-table-text-center": d(String(L))?.align === "center",
+                        "rvc-table-text-right": d(String(L))?.align === "right"
+                      },
+                      innerHTML: b
+                    }), null, 16, ge))), 128))
+                  ])
+                ]))
+              ])), 256))
+            ])
+          ]) : !e.items.length && !e.spinning ? (l(), n("tbody", be, [
+            u("tr", null, [
               u("td", {
                 colspan: e.headers.length,
                 class: "rvc-table-state"
               }, [
                 u("p", null, g(e.noResultsText), 1)
               ], 8, me)
-            ])) : (l(), n("tr", pe, [
+            ])
+          ])) : (l(), n("tbody", pe, [
+            u("tr", null, [
               u("td", {
                 colspan: e.headers.length,
                 class: "rvc-table-state"
@@ -494,12 +503,12 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
                       "aria-hidden": "true",
                       class: "rvc-table-spinner"
                     })) : $("", !0),
-                    x(" " + g(e.loadingText), 1)
+                    S(" " + g(e.loadingText), 1)
                   ])
                 ])
               ], 8, ye)
-            ]))
-          ]),
+            ])
+          ])),
           a.$slots.footer ? (l(), n("tfoot", he, [
             c(a.$slots, "footer", {
               headers: e.headers,
@@ -553,7 +562,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
   },
   emits: ["update:modelValue"],
   setup(e, { emit: r }) {
-    const v = e, f = r, { hasModelBinding: s } = T(), d = S(null), m = B({
+    const v = e, f = r, { hasModelBinding: s } = T(), d = x(null), m = B({
       get: () => v.modelValue,
       set: (o) => f("update:modelValue", o)
     }), a = B(() => [
@@ -591,7 +600,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
     }), { hasModelBinding: d } = T(), m = A(), a = B(() => ({
       ...m,
       type: "radio"
-    })), o = S(null);
+    })), o = x(null);
     return (t, i) => (l(), n("label", {
       class: p(["rvc-radio", e.rootClass])
     }, [
@@ -659,7 +668,7 @@ const ae = ["value"], le = ["value"], N = /* @__PURE__ */ w({
             onClick: (L) => d.value = b
           }), {
             default: O(() => [
-              x(g(i.name), 1)
+              S(g(i.name), 1)
             ]),
             _: 2
           }, 1040, ["as", "class", "onClick"]))), 128))

package/dist/core/index.js

@@ -1,4 +1,4 @@
-import { _ as e, a as s, b as t, c as r, d as m, e as p, f as x, g as c, h as f, i } from "../_shared/Tabs.vue_vue_type_script_setup_true_lang-B0RIqYLz.js";
+import { _ as e, a as s, b as t, c as r, d as m, e as p, f as x, g as c, h as f, i } from "../_shared/Tabs.vue_vue_type_script_setup_true_lang-CLF0EEY-.js";
 import { _ as b } from "../_shared/ChevronDownIcon-BYWciGnh.js";
 import { _ } from "../_shared/ButtonBase.vue_vue_type_script_setup_true_lang-ZYVNEyNx.js";
 import { _ as l } from "../_shared/FormInput.vue_vue_type_script_setup_true_lang-Bg7YPGyY.js";

package/dist/core.d.ts

@@ -280,6 +280,9 @@ declare function __VLS_template_6(): {
             } | null;
             header: DataTableHeader;
         }): any;
+        tbody?(_: {
+            items: DataTableItem[];
+        }): any;
         items?(_: {
             item: DataTableItem;
             index: number;

package/dist/index/index.js

@@ -1,4 +1,4 @@
-import { _ as r, a as t, b as e, c as s, d as m, e as p, f as x, g as f, h as _, i } from "../_shared/Tabs.vue_vue_type_script_setup_true_lang-B0RIqYLz.js";
+import { _ as r, a as t, b as e, c as s, d as m, e as p, f as x, g as f, h as _, i } from "../_shared/Tabs.vue_vue_type_script_setup_true_lang-CLF0EEY-.js";
 import { _ as d } from "../_shared/ChevronDownIcon-BYWciGnh.js";
 import { _ as n } from "../_shared/ButtonBase.vue_vue_type_script_setup_true_lang-ZYVNEyNx.js";
 import { _ as h } from "../_shared/FormInput.vue_vue_type_script_setup_true_lang-Bg7YPGyY.js";

package/dist/index.d.ts

@@ -814,6 +814,9 @@ declare function __VLS_template_6(): {
             } | null;
             header: DataTableHeader;
         }): any;
+        tbody?(_: {
+            items: DataTableItem[];
+        }): any;
         items?(_: {
             item: DataTableItem;
             index: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@robuust-digital/vue-components",
-  "version": "2.5.0",
+  "version": "2.6.1",
   "type": "module",
   "publishConfig": {
     "access": "public"