npm - @dcodegroup-au/dsg-vue - Versions diffs - 0.0.32 → 0.0.34 - Mend

@dcodegroup-au/dsg-vue 0.0.32 → 0.0.34

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 (14) hide show

package/dist/{DsgTablePerPage.vue_vue_type_style_index_0_lang-BZcdFc4A.js → DsgTablePerPage.vue_vue_type_style_index_0_lang-B8_U5eht.js} +1776 -1755
package/dist/{DsgTablePerPage.vue_vue_type_style_index_0_lang-CW51CLZ4.cjs → DsgTablePerPage.vue_vue_type_style_index_0_lang-DsjXXvFV.cjs} +146 -146
package/dist/components/Elements/DsgInput.vue.d.ts +1 -0
package/dist/components/Elements/DsgInputSelect.vue.d.ts +2 -1
package/dist/components/Elements/DsgProgress.vue.d.ts +1 -0
package/dist/components/Table/DsgTable.vue.d.ts +13 -18
package/dist/dsg-vue.cjs +10 -10
package/dist/dsg-vue.css +1 -1
package/dist/dsg-vue.esm.js +1963 -1944
package/dist/dsg-vue.table.cjs +2 -2
package/dist/dsg-vue.table.esm.js +403 -398
package/dist/main.d.ts +4 -2
package/dist/table.d.ts +28 -86
package/package.json +4 -4

package/dist/dsg-vue.table.esm.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { defineComponent as W, mergeModels as G, useModel as Y, computed as O, withDirectives as oe, createElementBlock as n, openBlock as a, createCommentVNode as k, createElementVNode as m, normalizeClass as F, createVNode as B, Fragment as E, renderList as q, vShow as Se, ref as y, useTemplateRef as ge, useAttrs as Fe, unref as U, withCtx as x, renderSlot as T, toDisplayString as _, createBlock as N, resolveDynamicComponent as Be, normalizeStyle as X, watch as te, onMounted as Me, Transition as Le, createTextVNode as Ee, useSlots as Re, createSlots as He, normalizeProps as Ie, mergeProps as ze, vModelSelect as Ae } from "vue";
-import { _ as A, k as Ve, v as Oe, g as Ue, u as qe, c as ve, e as ce, i as be, j as Ne } from "./DsgTablePerPage.vue_vue_type_style_index_0_lang-BZcdFc4A.js";
+import { defineComponent as W, mergeModels as G, useModel as Y, computed as V, withDirectives as oe, createElementBlock as s, openBlock as a, createCommentVNode as w, createElementVNode as y, normalizeClass as M, createVNode as L, Fragment as R, renderList as q, vShow as Se, ref as k, useTemplateRef as ge, useAttrs as Fe, unref as U, withCtx as Z, renderSlot as T, toDisplayString as x, createBlock as N, resolveDynamicComponent as Be, normalizeStyle as J, watch as ee, onMounted as Me, Transition as Le, createTextVNode as Ee, useSlots as Re, createSlots as He, normalizeProps as Ie, mergeProps as ze, vModelSelect as Ae } from "vue";
+import { _ as O, k as Ve, v as Oe, g as Ue, u as qe, c as ve, e as ce, i as be, j as Ne } from "./DsgTablePerPage.vue_vue_type_style_index_0_lang-B8_U5eht.js";
 import { ucfirst as We, ucwords as je, toSnakeCase as Ke } from "./dsg-vue.helpers-string.esm.js";
 import { data_get as ne } from "./dsg-vue.helpers-object.esm.js";
 const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disabled"], Je = ["onClick", "innerHTML"], Xe = ["onClick", "innerHTML"], Ze = ["disabled"], xe = ["disabled"], fe = /* @__PURE__ */ W({
@@ -17,76 +17,76 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
     paginationModifiers: {}
   }),
   emits: /* @__PURE__ */ G(["dsg-table:change-page"], ["update:pagination"]),
-  setup(t, { expose: $, emit: v }) {
-    const i = Y(t, "pagination"), f = O(() => i.value === null ? 0 : i.value?.last_page - t.firstPage + 1), b = O(() => i.value === null ? 0 : i.value?.last_page), h = O(() => i.value === null ? !1 : i.value?.current_page === t.firstPage), p = O(() => i.value === null ? !1 : i.value?.current_page === b.value), H = O(() => f.value < t.onEachSide * 2 + 4), V = O(() => t.onEachSide * 2 + 1), r = O(() => !i.value || i.value?.current_page <= t.onEachSide ? 1 : i.value?.current_page >= f.value - t.onEachSide ? f.value - t.onEachSide * 2 : i.value?.current_page - t.onEachSide), w = v, s = (u) => {
-      w("dsg-table:change-page", u);
-    }, d = (u) => u === i.value?.current_page;
+  setup(t, { expose: $, emit: g }) {
+    const r = Y(t, "pagination"), f = V(() => r.value === null ? 0 : r.value?.last_page - t.firstPage + 1), v = V(() => r.value === null ? 0 : r.value?.last_page), h = V(() => r.value === null ? !1 : r.value?.current_page === t.firstPage), m = V(() => r.value === null ? !1 : r.value?.current_page === v.value), z = V(() => f.value < t.onEachSide * 2 + 4), H = V(() => t.onEachSide * 2 + 1), p = V(() => !r.value || r.value?.current_page <= t.onEachSide ? 1 : r.value?.current_page >= f.value - t.onEachSide ? f.value - t.onEachSide * 2 : r.value?.current_page - t.onEachSide), b = g, n = (c) => {
+      b("dsg-table:change-page", c);
+    }, i = (c) => c === r.value?.current_page;
     return $({
-      loadPage: s
-    }), (u, C) => oe((a(), n("div", Qe, [
-      u.showFirstLast ? (a(), n("a", {
+      loadPage: n
+    }), (c, D) => oe((a(), s("div", Qe, [
+      c.showFirstLast ? (a(), s("a", {
         key: 0,
-        onClick: C[0] || (C[0] = (I) => s(u.firstPage)),
-        class: F([[h.value ? "disabled" : ""], "dsg-table--pagination-link"]),
+        onClick: D[0] || (D[0] = (S) => n(c.firstPage)),
+        class: M([[h.value ? "disabled" : ""], "dsg-table--pagination-link"]),
         disabled: h.value,
         title: "First",
         "aria-label": "First"
       }, [
-        B(A, {
-          icon: u.firstIcon,
+        L(O, {
+          icon: c.firstIcon,
           size: "sm"
         }, null, 8, ["icon"])
-      ], 10, Ye)) : k("", !0),
-      m("a", {
-        onClick: C[1] || (C[1] = (I) => s("prev")),
-        class: F([[h.value ? "disabled" : ""], "dsg-table--pagination-link"]),
+      ], 10, Ye)) : w("", !0),
+      y("a", {
+        onClick: D[1] || (D[1] = (S) => n("prev")),
+        class: M([[h.value ? "disabled" : ""], "dsg-table--pagination-link"]),
         disabled: h.value,
         title: "Previous",
         "aria-label": "Previous"
       }, [
-        B(A, {
-          icon: u.prevIcon,
+        L(O, {
+          icon: c.prevIcon,
           size: "sm"
         }, null, 8, ["icon"])
       ], 10, Ge),
-      H.value ? (a(!0), n(E, { key: 1 }, q(f.value, (I, D) => (a(), n("a", {
-        key: D,
-        onClick: (j) => s(D + u.firstPage),
-        class: F([[d(D + u.firstPage) ? "active" : ""], "dsg-table--pagination-link"]),
-        innerHTML: I
-      }, null, 10, Je))), 128)) : (a(!0), n(E, { key: 2 }, q(V.value, (I, D) => (a(), n("a", {
-        key: D,
-        onClick: (j) => s(r.value + D + u.firstPage - 1),
-        class: F([[d(r.value + D + u.firstPage - 1) ? "active" : ""], "dsg-table--pagination-link"]),
-        innerHTML: r.value + I - 1
+      z.value ? (a(!0), s(R, { key: 1 }, q(f.value, (S, C) => (a(), s("a", {
+        key: C,
+        onClick: (j) => n(C + c.firstPage),
+        class: M([[i(C + c.firstPage) ? "active" : ""], "dsg-table--pagination-link"]),
+        innerHTML: S
+      }, null, 10, Je))), 128)) : (a(!0), s(R, { key: 2 }, q(H.value, (S, C) => (a(), s("a", {
+        key: C,
+        onClick: (j) => n(p.value + C + c.firstPage - 1),
+        class: M([[i(p.value + C + c.firstPage - 1) ? "active" : ""], "dsg-table--pagination-link"]),
+        innerHTML: p.value + S - 1
       }, null, 10, Xe))), 128)),
-      m("a", {
-        onClick: C[2] || (C[2] = (I) => s("next")),
-        class: F([[p.value ? "disabled" : ""], "dsg-table--pagination-link"]),
-        disabled: p.value,
+      y("a", {
+        onClick: D[2] || (D[2] = (S) => n("next")),
+        class: M([[m.value ? "disabled" : ""], "dsg-table--pagination-link"]),
+        disabled: m.value,
         title: "Next",
         "aria-label": "Next"
       }, [
-        B(A, {
-          icon: u.nextIcon,
+        L(O, {
+          icon: c.nextIcon,
           size: "sm"
         }, null, 8, ["icon"])
       ], 10, Ze),
-      u.showFirstLast ? (a(), n("a", {
+      c.showFirstLast ? (a(), s("a", {
         key: 3,
-        onClick: C[3] || (C[3] = (I) => s(b.value)),
-        class: F([[p.value ? "disabled" : ""], "dsg-table--pagination-link"]),
-        disabled: p.value,
+        onClick: D[3] || (D[3] = (S) => n(v.value)),
+        class: M([[m.value ? "disabled" : ""], "dsg-table--pagination-link"]),
+        disabled: m.value,
         title: "Last",
         "aria-label": "Last"
       }, [
-        B(A, {
-          icon: u.lastIcon,
+        L(O, {
+          icon: c.lastIcon,
           size: "sm"
         }, null, 8, ["icon"])
-      ], 10, xe)) : k("", !0)
+      ], 10, xe)) : w("", !0)
     ], 512)), [
-      [Se, i.value && b.value > u.firstPage]
+      [Se, r.value && v.value > c.firstPage]
     ]);
   }
 }), _e = ["innerHTML"], pe = /* @__PURE__ */ W({
@@ -100,10 +100,10 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
   }),
   emits: ["update:pagination"],
   setup(t) {
-    const $ = Y(t, "pagination"), v = O(() => $.value == null || $.value.total == 0 ? t.noDataTemplate : t.infoTemplate.replace("{from}", ($.value?.from || 0).toString()).replace("{to}", ($.value?.to || 0).toString()).replace("{total}", ($.value?.total || 0).toString()));
-    return (i, f) => (a(), n("div", {
+    const $ = Y(t, "pagination"), g = V(() => $.value == null || $.value.total == 0 ? t.noDataTemplate : t.infoTemplate.replace("{from}", ($.value?.from || 0).toString()).replace("{to}", ($.value?.to || 0).toString()).replace("{total}", ($.value?.total || 0).toString()));
+    return (r, f) => (a(), s("div", {
       class: "dsg-table--pagination-info",
-      innerHTML: v.value
+      innerHTML: g.value
     }, null, 8, _e));
   }
 }), et = {
@@ -119,10 +119,10 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
   },
   emits: ["dsg-table:action-edit", "dsg-table:action-view", "dsg-table:action-delete", "dsg-table:action-archive", "dsg-table:link-clicked"],
   setup(t, { emit: $ }) {
-    const v = y(!1);
+    const g = k(!1);
     ge("dsgTableActions");
-    const i = Fe(), f = y(i.data.rowData?.actions ?? null), b = y(i.data.rowData?.links ?? null), h = y(i.data.rowData ?? null), p = (w) => {
-      switch (w) {
+    const r = Fe(), f = k(r.data.rowData?.actions ?? null), v = k(r.data.rowData?.links ?? null), h = k(r.data.rowData ?? null), m = (b) => {
+      switch (b) {
         case "edit":
           return "edit-05";
         case "view":
@@ -134,95 +134,95 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
         default:
           return "dots-horizontal";
       }
-    }, H = (w, s, d) => {
-      switch (s) {
+    }, z = (b, n, i) => {
+      switch (n) {
         case "edit":
-          r("dsg-table:action-edit", d, h.value);
+          p("dsg-table:action-edit", i, h.value);
           break;
         case "view":
-          r("dsg-table:action-view", d, h.value);
+          p("dsg-table:action-view", i, h.value);
           break;
         case "delete":
-          r("dsg-table:action-delete", d, h.value);
+          p("dsg-table:action-delete", i, h.value);
           break;
         case "archive":
-          r("dsg-table:action-archive", d, h.value);
+          p("dsg-table:action-archive", i, h.value);
           break;
       }
-    }, V = (w, s) => {
-      const d = w.actionId || w.label.trim().toLowerCase().replace(/[^a-z0-9-]/g, "-").replace(/-+/g, "-");
-      r("dsg-table:link-clicked", s, d, h.value);
-    }, r = $;
-    return (w, s) => oe((a(), n("div", et, [
-      B(U(Ve), {
+    }, H = (b, n) => {
+      const i = b.actionId || b.label.trim().toLowerCase().replace(/[^a-z0-9-]/g, "-").replace(/-+/g, "-");
+      p("dsg-table:link-clicked", n, i, h.value);
+    }, p = $;
+    return (b, n) => oe((a(), s("div", et, [
+      L(U(Ve), {
         triggers: [],
-        placement: w.placement,
+        placement: b.placement,
         "handle-resize": !0,
         strategy: "absolute",
-        shown: v.value,
+        shown: g.value,
         class: "dsg-table--actions__popper",
-        onHide: s[1] || (s[1] = (d) => v.value = !1),
+        onHide: n[1] || (n[1] = (i) => g.value = !1),
         ref: "floatingVueFilterDropdown"
       }, {
-        popper: x(() => [
-          v.value ? (a(), n("div", at, [
-            (a(!0), n(E, null, q(f.value, (d, u) => (a(), n(E, null, [
-              ["edit", "view", "delete", "archive"].includes(String(u)) ? (a(), n("a", {
-                key: u,
+        popper: Z(() => [
+          g.value ? (a(), s("div", at, [
+            (a(!0), s(R, null, q(f.value, (i, c) => (a(), s(R, null, [
+              ["edit", "view", "delete", "archive"].includes(String(c)) ? (a(), s("a", {
+                key: c,
                 href: f.value?.link,
                 target: f.value?.target || "_self",
-                onClick: (C) => H(d, String(u), C)
+                onClick: (D) => z(i, String(c), D)
               }, [
-                m("div", {
-                  class: F(["dsg-table--actions-menu-item", String(u)])
+                y("div", {
+                  class: M(["dsg-table--actions-menu-item", String(c)])
                 }, [
-                  B(A, {
-                    icon: p(String(u)),
+                  L(O, {
+                    icon: m(String(c)),
                     size: "sm"
                   }, null, 8, ["icon"]),
-                  m("span", {
+                  y("span", {
                     class: "flex-1",
-                    textContent: _(U(We)(String(u)))
+                    textContent: x(U(We)(String(c)))
                   }, null, 8, st)
                 ], 2)
-              ], 8, lt)) : k("", !0)
+              ], 8, lt)) : w("", !0)
             ], 64))), 256)),
-            f.value && b.value ? (a(), n("hr", nt)) : k("", !0),
-            b.value ? (a(!0), n(E, { key: 1 }, q(b.value, (d) => (a(), n(E, {
-              key: d.label
+            f.value && v.value ? (a(), s("hr", nt)) : w("", !0),
+            v.value ? (a(!0), s(R, { key: 1 }, q(v.value, (i) => (a(), s(R, {
+              key: i.label
             }, [
-              d.hasOwnProperty("component") ? (a(), N(Be(d.component), {
+              i.hasOwnProperty("component") ? (a(), N(Be(i.component), {
                 key: 0,
-                quote: U(i).data.data.rowData,
-                "row-data": U(i).data.data.rowData
-              }, null, 8, ["quote", "row-data"])) : d.hasOwnProperty("type") && d.type == "break" ? (a(), n("hr", ot)) : (a(), n("a", {
+                quote: U(r).data.data.rowData,
+                "row-data": U(r).data.data.rowData
+              }, null, 8, ["quote", "row-data"])) : i.hasOwnProperty("type") && i.type == "break" ? (a(), s("hr", ot)) : (a(), s("a", {
                 key: 2,
-                href: d.link,
-                target: d.target || "_self",
-                class: F(["dsg-table--actions-menu-item", d.class]),
-                onClick: (u) => V(d, u)
+                href: i.link,
+                target: i.target || "_self",
+                class: M(["dsg-table--actions-menu-item", i.class]),
+                onClick: (c) => H(i, c)
               }, [
-                d.icon ? (a(), N(A, {
+                i.icon ? (a(), N(O, {
                   key: 0,
-                  icon: d.icon,
+                  icon: i.icon,
                   size: "sm"
-                }, null, 8, ["icon"])) : k("", !0),
-                m("span", rt, _(d.label), 1)
+                }, null, 8, ["icon"])) : w("", !0),
+                y("span", rt, x(i.label), 1)
               ], 10, it))
-            ], 64))), 128)) : k("", !0)
-          ])) : k("", !0)
+            ], 64))), 128)) : w("", !0)
+          ])) : w("", !0)
         ]),
-        default: x(() => [
-          m("div", tt, [
-            m("button", {
+        default: Z(() => [
+          y("div", tt, [
+            y("button", {
               type: "button",
               class: "dsg-table--actions-button",
               "aria-expanded": "false",
               "aria-haspopup": "true",
-              onClick: s[0] || (s[0] = (d) => v.value = !v.value)
+              onClick: n[0] || (n[0] = (i) => g.value = !g.value)
             }, [
-              T(w.$slots, "dsg-table-action-button-content", {}, () => [
-                B(A, {
+              T(b.$slots, "dsg-table-action-button-content", {}, () => [
+                L(O, {
                   icon: "dots-vertical",
                   size: "sm"
                 })
@@ -233,7 +233,7 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
         _: 3
       }, 8, ["placement", "shown"])
     ])), [
-      [U(Oe), () => v.value = !1]
+      [U(Oe), () => g.value = !1]
     ]);
   }
 }), dt = { class: "dsg-table--search" }, me = /* @__PURE__ */ W({
@@ -251,27 +251,27 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
   },
   emits: ["dsg-table:term-changed"],
   setup(t, { emit: $ }) {
-    const v = y(""), i = $, f = qe((b) => {
-      v.value = b, i("dsg-table:term-changed", v.value);
+    const g = k(""), r = $, f = qe((v) => {
+      g.value = v, r("dsg-table:term-changed", g.value);
     }, 300);
-    return (b, h) => (a(), n("div", dt, [
-      B(Ue, {
-        value: v.value,
-        "onUpdate:value": h[0] || (h[0] = (p) => v.value = p),
-        name: b.name,
-        id: b.id || b.name,
-        placeholder: b.placeholder,
-        disabled: b.disabled,
-        required: b.required,
-        readonly: b.readonly,
-        hidden: b.hidden,
+    return (v, h) => (a(), s("div", dt, [
+      L(Ue, {
+        value: g.value,
+        "onUpdate:value": h[0] || (h[0] = (m) => g.value = m),
+        name: v.name,
+        id: v.id || v.name,
+        placeholder: v.placeholder,
+        disabled: v.disabled,
+        required: v.required,
+        readonly: v.readonly,
+        hidden: v.hidden,
         "has-clear-button": !0,
         autocomplete: "off",
         size: "sm",
         icon: "search-sm",
         "icon-clickable": !0,
-        onIconClicked: h[1] || (h[1] = (p) => U(f)(p)),
-        onEnterPressed: h[2] || (h[2] = (p) => U(f)(p)),
+        onIconClicked: h[1] || (h[1] = (m) => U(f)(m)),
+        onEnterPressed: h[2] || (h[2] = (m) => U(f)(m)),
         onOnClear: h[3] || (h[3] = () => U(f)(""))
       }, null, 8, ["value", "name", "id", "placeholder", "disabled", "required", "readonly", "hidden"])
     ]));
@@ -305,79 +305,79 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
   }),
   emits: /* @__PURE__ */ G(["dsg-table:sort-field", "dsg-table:on-select-all", "dsg-table:on-deselect-all"], ["update:sortField", "update:selectedRows", "update:hasSelected"]),
   setup(t, { emit: $ }) {
-    const v = Y(t, "sortField"), i = Y(t, "selectedRows"), f = Y(t, "hasSelected"), b = y("17px"), h = (r) => {
-      f.value && i.value.length > 0 && i.value.length !== t.tableDataLength ? (f.value = !0, p("dsg-table:on-select-all")) : !f.value && i.value.length === 0 ? (f.value = !1, p("dsg-table:on-select-all")) : p("dsg-table:on-deselect-all");
-    }, p = $, H = (r, w) => [
-      r,
-      r + "-" + Ke(String(w?.name)),
-      w.titleClass || "",
-      { sortable: w.sortable },
-      { "sort-active": v.value?.name === w.name }
-    ], V = (r) => {
-      r.sortable && (v.value = {
-        name: String(r?.name),
-        field: String(r?.sortField),
-        direction: v.value?.name === r.name && v.value?.direction === "asc" ? "desc" : "asc"
-      }, p("dsg-table:sort-field", r));
+    const g = Y(t, "sortField"), r = Y(t, "selectedRows"), f = Y(t, "hasSelected"), v = k("17px"), h = (p) => {
+      f.value && r.value.length > 0 && r.value.length !== t.tableDataLength ? (f.value = !0, m("dsg-table:on-select-all")) : !f.value && r.value.length === 0 ? (f.value = !1, m("dsg-table:on-select-all")) : m("dsg-table:on-deselect-all");
+    }, m = $, z = (p, b) => [
+      p,
+      p + "-" + Ke(String(b?.name)),
+      b.titleClass || "",
+      { sortable: b.sortable },
+      { "sort-active": g.value?.name === b.name }
+    ], H = (p) => {
+      p.sortable && (g.value = {
+        name: String(p?.name),
+        field: String(p?.sortField),
+        direction: g.value?.name === p.name && g.value?.direction === "asc" ? "desc" : "asc"
+      }, m("dsg-table:sort-field", p));
     };
-    return (r, w) => (a(), n("tr", ut, [
-      r.hasSelectAll ? (a(), n("th", ct, [
-        B(ve, {
+    return (p, b) => (a(), s("tr", ut, [
+      p.hasSelectAll ? (a(), s("th", ct, [
+        L(ve, {
           modelValue: f.value,
           "onUpdate:modelValue": [
-            w[0] || (w[0] = (s) => f.value = s),
+            b[0] || (b[0] = (n) => f.value = n),
             h
           ],
-          indeterminate: i.value.length > 0 && i.value.length !== r.tableDataLength
+          indeterminate: r.value.length > 0 && r.value.length !== p.tableDataLength
         }, null, 8, ["modelValue", "indeterminate"])
-      ])) : k("", !0),
-      r.showExpandDetail ? (a(), n("th", gt)) : k("", !0),
-      (a(!0), n(E, null, q(r.fields, (s, d) => (a(), n(E, null, [
-        s?.visible ? (a(), n("th", {
-          key: d,
-          class: F(H("dsg-table--th", s)),
-          style: X([{ width: s.width || void 0 }, s.style]),
-          title: s.title + (s.sortable ? " Sort" : ""),
-          id: "_" + s.name,
-          onClick: (u) => V(s),
+      ])) : w("", !0),
+      p.showExpandDetail ? (a(), s("th", gt)) : w("", !0),
+      (a(!0), s(R, null, q(p.fields, (n, i) => (a(), s(R, null, [
+        n?.visible ? (a(), s("th", {
+          key: i,
+          class: M(z("dsg-table--th", n)),
+          style: J([{ width: n.width || void 0 }, n.style]),
+          title: n.title + (n.sortable ? " Sort" : ""),
+          id: "_" + n.name,
+          onClick: (c) => H(n),
           scope: "col"
         }, [
-          s.sortable ? (a(), n("div", bt, [
-            s.title ? (a(), n("span", {
+          n.sortable ? (a(), s("div", bt, [
+            n.title ? (a(), s("span", {
               key: 0,
               class: "dsg-table--th-title",
-              innerHTML: s.title
-            }, null, 8, ft)) : k("", !0),
-            s.sortable && v.value?.name !== s.name ? (a(), N(A, {
+              innerHTML: n.title
+            }, null, 8, ft)) : w("", !0),
+            n.sortable && g.value?.name !== n.name ? (a(), N(O, {
               key: 1,
               icon: "chevron-selector-vertical",
               class: "inline-flex",
               size: "xs"
-            })) : k("", !0),
-            s.sortable && v.value?.name === s.name && v.value?.direction === "asc" ? (a(), N(A, {
+            })) : w("", !0),
+            n.sortable && g.value?.name === n.name && g.value?.direction === "asc" ? (a(), N(O, {
               key: 2,
               icon: "chevron-down",
               class: "inline-flex",
               size: "xs"
-            })) : k("", !0),
-            s.sortable && v.value?.name === s.name && v.value?.direction === "desc" ? (a(), N(A, {
+            })) : w("", !0),
+            n.sortable && g.value?.name === n.name && g.value?.direction === "desc" ? (a(), N(O, {
               key: 3,
               icon: "chevron-up",
               class: "inline-flex",
               size: "xs"
-            })) : k("", !0)
-          ])) : (a(), n("span", {
+            })) : w("", !0)
+          ])) : (a(), s("span", {
             key: 1,
             class: "dsg-table--th-title",
-            innerHTML: U(je)(String(s?.title))
+            innerHTML: U(je)(String(n?.title))
           }, null, 8, pt))
-        ], 14, vt)) : k("", !0)
+        ], 14, vt)) : w("", !0)
       ], 64))), 256)),
-      r.scrollVisible ? (a(), n("th", {
+      p.scrollVisible ? (a(), s("th", {
         key: 2,
-        style: X({ width: b.value }),
+        style: J({ width: v.value }),
         class: "dsg-table--th-col-gutter"
-      }, null, 4)) : k("", !0)
+      }, null, 4)) : w("", !0)
     ]));
   }
 }), ht = { class: "dsg-table--wrapper" }, mt = ["span"], yt = {
@@ -445,8 +445,8 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
     perPageModifiers: {}
   }),
   emits: /* @__PURE__ */ G(["dsg-table:loading", "dsg-table:loaded", "dsg-table:load-success", "dsg-table:load-error", "dsg-table:pagination-data", "dsg-table:rows-selected"], ["update:filterParams", "update:perPage"]),
-  setup(t, { expose: $, emit: v }) {
-    const i = (e) => e.map((o, g) => ({
+  setup(t, { expose: $, emit: g }) {
+    const r = (e) => e.map((o, u) => ({
       field: o.field || "",
       title: o.title || "",
       name: o.name || "",
@@ -457,238 +457,238 @@ const Qe = { class: "dsg-table--pagination" }, Ye = ["disabled"], Ge = ["disable
       sortField: o.sortField || null,
       sortable: o.sortField,
       formatter: o.formatter || null,
-      $_index: g
-    })), f = y(i(t.fields)), b = y(t.data), h = y(null), p = y(t.initialPage), H = y("17px"), V = y(!1), r = y({}), w = y(0), s = y(!0), d = y(null), u = y(null), C = Y(t, "filterParams"), I = Y(t, "perPage"), D = y([]), j = y(!1), K = O(() => t.tableHeight != null), Q = O(() => f.value.filter((e) => e.visible).length);
-    te(
-      () => D.value.length,
+      $_index: u
+    })), f = k(r(t.fields)), v = k(t.data), h = k(null), m = k(t.initialPage), z = k("17px"), H = k(!1), p = k({}), b = k(0), n = k(!0), i = k(null), c = k(null), D = Y(t, "filterParams"), S = Y(t, "perPage"), C = k([]), j = k(!1), K = V(() => t.tableHeight != null), Q = V(() => f.value.filter((e) => e.visible).length);
+    ee(
+      () => C.value.length,
       (e) => {
         j.value = t.selectable && e > 0;
       },
       { immediate: !0 }
-    ), te(
+    ), ee(
       () => t.fields,
       (e) => {
-        f.value = i(e);
+        f.value = r(e);
       },
       { immediate: !0 }
-    ), te(
-      () => C.value,
+    ), ee(
+      () => D.value,
       () => {
-        Z();
+        X();
       },
       { deep: !0 }
-    ), te(
-      () => I.value,
+    ), ee(
+      () => S.value,
       () => {
-        Z();
+        X();
       }
     );
-    const z = v, ee = (e, o) => e.formatter && typeof e.formatter == "function" ? e.formatter(e, o) : ne(o, String(e?.name), ""), ae = (e) => "dsg-field--" + e.name?.toLowerCase().replaceAll(/[_ ]/g, "-"), l = (e) => {
+    const A = g, te = (e, o) => e.formatter && typeof e.formatter == "function" ? e.formatter(e, o) : ne(o, String(e?.name), ""), _ = (e) => "dsg-field--" + e.name?.toLowerCase().replaceAll(/[_ ]/g, "-"), ae = (e) => {
       if (t.selectable) {
         if (e.selected)
-          D.value.push(e);
+          C.value.push(e);
         else {
-          const o = D.value.findIndex((g) => g[t.trackBy] === e[t.trackBy]);
-          o !== -1 && D.value.splice(o, 1);
+          const o = C.value.findIndex((u) => u[t.trackBy] === e[t.trackBy]);
+          o !== -1 && C.value.splice(o, 1);
         }
-        z("dsg-table:rows-selected", D.value);
+        A("dsg-table:rows-selected", C.value);
       }
-    }, c = () => {
-      t.selectable && (b.value?.forEach((e) => {
+    }, l = () => {
+      t.selectable && (v.value?.forEach((e) => {
         e.selected = !0;
-      }), D.value = b.value?.filter((e) => e.selected) ?? [], z("dsg-table:rows-selected", D.value));
-    }, P = () => {
-      t.selectable && (b.value?.forEach((e) => {
+      }), C.value = v.value?.filter((e) => e.selected) ?? [], A("dsg-table:rows-selected", C.value));
+    }, d = () => {
+      t.selectable && (v.value?.forEach((e) => {
         e.selected = !1;
-      }), D.value = [], z("dsg-table:rows-selected", D.value));
-    }, S = (e) => {
-      e === "prev" ? p.value > t.firstPage && p.value-- : e === "next" ? p.value < (h.value?.last_page ?? 0) && p.value++ : e != p.value && e >= t.firstPage && e <= (h.value?.last_page ?? 0) && (p.value = e), Z();
-    }, M = () => ({
-      [t.queryParams?.sort]: d.value ? (d.value?.direction === "desc" ? "-" : "") + d.value?.field : void 0,
-      [t.queryParams?.order]: d.value?.direction,
-      [t.queryParams?.page]: p.value,
-      [t.queryParams?.perPage]: I.value
-    }), J = () => {
-      u.value && (u.value.abort(), u.value = null);
+      }), C.value = [], A("dsg-table:rows-selected", C.value));
+    }, P = (e) => {
+      e === "prev" ? m.value > t.firstPage && m.value-- : e === "next" ? m.value < (h.value?.last_page ?? 0) && m.value++ : e != m.value && e >= t.firstPage && e <= (h.value?.last_page ?? 0) && (m.value = e), X();
+    }, F = () => ({
+      [t.queryParams?.sort]: i.value ? (i.value?.direction === "desc" ? "-" : "") + i.value?.field : void 0,
+      [t.queryParams?.order]: i.value?.direction,
+      [t.queryParams?.page]: m.value,
+      [t.queryParams?.perPage]: S.value
+    }), B = () => {
+      c.value && (c.value.abort(), c.value = null);
     }, le = async (e, o) => {
-      J();
-      const g = new AbortController();
-      if (o.signal = g.signal, u.value = g, t.httpMethod.toLowerCase() === "get")
+      B();
+      const u = new AbortController();
+      if (o.signal = u.signal, c.value = u, t.httpMethod.toLowerCase() === "get")
         return await ce.get(e, o);
       {
-        const R = o.params;
-        return delete o.params, await ce.post(e, R, o);
+        const I = o.params;
+        return delete o.params, await ce.post(e, I, o);
       }
     }, ie = (e) => {
-      z("dsg-table:load-success", e);
+      A("dsg-table:load-success", e);
       const o = t.transform ? t.transform(e.data) : e.data;
-      b.value = ne(o, t.dataPath, null), t.selectable && b.value?.forEach((g) => {
-        g.selected = g.selected ?? !1;
-      }), h.value = ne(o, t.paginationPath, null) ?? null, w.value = b.value?.length ? b.value[0].order : w, h.value === null && console.warn(
+      v.value = ne(o, t.dataPath, null), t.selectable && v.value?.forEach((u) => {
+        u.selected = u.selected ?? !1;
+      }), h.value = ne(o, t.paginationPath, null) ?? null, b.value = v.value?.length ? v.value[0].order : b, h.value === null && console.warn(
         'DsgTable: pagination-path "' + t.paginationPath + `" not found. It looks like the data returned from the server does not have pagination information or you may have set it incorrectly.
 You can explicitly suppress this warning by setting pagination-path="".`
-      ), z("dsg-table:pagination-data", h.value), z("dsg-table:loaded"), s.value = !1;
+      ), A("dsg-table:pagination-data", h.value), m.value > (h.value?.to || 0) && (m.value = t.initialPage), A("dsg-table:loaded"), n.value = !1;
     }, re = (e) => {
-      console.error("load-error", e), z("dsg-table:load-error", e), z("dsg-table:loaded"), s.value = !1;
-    }, Z = (e = ie, o = re, g = {}) => {
-      const R = e || ie, L = o || re;
+      console.error("load-error", e), A("dsg-table:load-error", e), A("dsg-table:loaded"), n.value = !1;
+    }, X = (e = ie, o = re, u = {}) => {
+      const I = e || ie, E = o || re;
       if (t.apiMode)
-        return s.value = !0, z("dsg-table:loading", s.value), t.httpOptions.params = {
-          ...M(),
-          ...C.value
-        }, le(t.apiUrl, t.httpOptions).then(R).catch((se) => L(se));
-    }, ke = (e, o, g) => {
-    }, we = (e, o, g) => {
-    }, Pe = (e, o, g) => {
-    }, $e = (e, o, g, R) => {
-    }, Ce = (e, o, g, R) => {
-    }, De = (e, o, g, R) => {
-    }, Te = (e, o, g) => {
+        return n.value = !0, A("dsg-table:loading", n.value), t.httpOptions.params = {
+          ...F(),
+          ...D.value
+        }, le(t.apiUrl, t.httpOptions).then(I).catch((se) => E(se));
+    }, ke = (e, o, u) => {
+    }, we = (e, o, u) => {
+    }, Pe = (e, o, u) => {
+    }, $e = (e, o, u, I) => {
+    }, Ce = (e, o, u, I) => {
+    }, De = (e, o, u, I) => {
+    }, Te = (e, o, u) => {
     };
     Me(() => {
-      t.apiMode === !0 && Z();
+      t.apiMode === !0 && X();
     });
     const de = () => {
-      t.apiMode && (p.value = t.initialPage, D.value = [], J(), Z());
+      t.apiMode && (C.value = [], B(), X());
     };
     return $({
-      changePage: S,
+      changePage: P,
       reload: de
-    }), (e, o) => (a(), n("div", ht, [
-      m("div", {
+    }), (e, o) => (a(), s("div", ht, [
+      y("div", {
         ref: "dsgTableBodyWrapper",
-        class: F(["dsg-table-body-wrapper", { "fixed-header": K.value }]),
-        style: X({ height: e.tableHeight || void 0 })
+        class: M(["dsg-table-body-wrapper", { "fixed-header": K.value }]),
+        style: J({ height: e.tableHeight || void 0 })
       }, [
-        m("table", {
-          class: F(["dsg-table-main", K.value ? "fixed-header" : "", r.value.table, "table-" + e.tableLayout])
+        y("table", {
+          class: M(["dsg-table-main", K.value ? "fixed-header" : "", p.value.table, "table-" + e.tableLayout])
         }, [
-          m("colgroup", { span: Q.value }, [
-            (a(!0), n(E, null, q(f.value, (g, R) => (a(), n(E, null, [
-              g?.visible ? (a(), n("col", {
-                key: R,
-                style: X({ width: g.width || void 0 }),
-                class: F("dsg-table--col-" + g.name + " " + g.titleClass)
-              }, null, 6)) : k("", !0)
+          y("colgroup", { span: Q.value }, [
+            (a(!0), s(R, null, q(f.value, (u, I) => (a(), s(R, null, [
+              u?.visible ? (a(), s("col", {
+                key: I,
+                style: J({ width: u.width || void 0 }),
+                class: M("dsg-table--col-" + u.name + " " + u.titleClass)
+              }, null, 6)) : w("", !0)
             ], 64))), 256)),
-            !K.value && V.value ? (a(), n("col", {
+            !K.value && H.value ? (a(), s("col", {
               key: 0,
-              style: X({ width: H.value }),
+              style: J({ width: z.value }),
               class: "dsg-table--col-gutter"
-            }, null, 4)) : k("", !0)
+            }, null, 4)) : w("", !0)
           ], 8, mt),
-          m("thead", {
-            class: F([[r.value.thead, { sticky: K.value, "top-0": K.value }], "dsg-table--head"])
+          y("thead", {
+            class: M([[p.value.thead, { sticky: K.value, "top-0": K.value }], "dsg-table--head"])
           }, [
             T(e.$slots, "tableHeader", { fields: f.value }, () => [
-              B(ye, {
+              L(ye, {
                 fields: f.value,
                 "has-select-all": e.selectable,
-                "selected-rows": D.value,
-                "onUpdate:selectedRows": o[0] || (o[0] = (g) => D.value = g),
+                "selected-rows": C.value,
+                "onUpdate:selectedRows": o[0] || (o[0] = (u) => C.value = u),
                 "has-selected": j.value,
-                "onUpdate:hasSelected": o[1] || (o[1] = (g) => j.value = g),
-                "scroll-visible": V.value,
+                "onUpdate:hasSelected": o[1] || (o[1] = (u) => j.value = u),
+                "scroll-visible": H.value,
                 "show-expand-detail": e.hasDetailRow && e.showExpandDetail,
-                "table-data-length": b.value?.length,
-                "sort-field": d.value,
-                "onUpdate:sortField": o[2] || (o[2] = (g) => d.value = g),
-                "onDsgTable:sortField": o[3] || (o[3] = (g) => de()),
-                "onDsgTable:onSelectAll": c,
-                "onDsgTable:onDeselectAll": P
+                "table-data-length": v.value?.length,
+                "sort-field": i.value,
+                "onUpdate:sortField": o[2] || (o[2] = (u) => i.value = u),
+                "onDsgTable:sortField": o[3] || (o[3] = (u) => de()),
+                "onDsgTable:onSelectAll": l,
+                "onDsgTable:onDeselectAll": d
               }, null, 8, ["fields", "has-select-all", "selected-rows", "has-selected", "scroll-visible", "show-expand-detail", "table-data-length", "sort-field"])
             ])
           ], 2),
-          m("tbody", {
-            class: F(["dsg-table--body", r.value.tbody])
+          y("tbody", {
+            class: M(["dsg-table--body", p.value.tbody])
           }, [
-            s.value ? (a(), n("tr", yt, [
-              m("td", { colspan: Q.value }, [
-                m("div", {
+            n.value ? (a(), s("tr", yt, [
+              y("td", { colspan: Q.value }, [
+                y("div", {
                   "aria-label": "Loading...",
                   role: "status",
                   class: "flex items-center space-x-3 h-12 w-full justify-center",
                   colspan: Q.value
                 }, [
                   T(e.$slots, "dsg-table-loading", {}, () => [
-                    B(A, {
+                    L(O, {
                       icon: "loading-02",
                       class: "animate-spin"
                     }),
-                    o[4] || (o[4] = m("span", { class: "text-xs font-medium text-gray-500" }, "Loading...", -1))
+                    o[4] || (o[4] = y("span", { class: "text-xs font-medium text-gray-500" }, "Loading...", -1))
                   ])
                 ], 8, wt)
               ], 8, kt)
-            ])) : (a(!0), n(E, { key: 1 }, q(b.value, (g, R) => (a(), n(E, { key: R }, [
-              m("tr", {
-                class: F(["dsg-table--tbody-row", { odd: R % 2 === 0, even: R % 2 !== 0, "row-selected": g.selected }]),
-                onClick: (L) => ke(),
-                onDblclick: (L) => we(),
-                onMouseover: (L) => Pe()
+            ])) : (a(!0), s(R, { key: 1 }, q(v.value, (u, I) => (a(), s(R, { key: I }, [
+              y("tr", {
+                class: M(["dsg-table--tbody-row", { odd: I % 2 === 0, even: I % 2 !== 0, "row-selected": u.selected }]),
+                onClick: (E) => ke(),
+                onDblclick: (E) => we(),
+                onMouseover: (E) => Pe()
               }, [
-                e.selectable ? (a(), n("td", $t, [
-                  B(ve, {
-                    modelValue: g.selected,
-                    "onUpdate:modelValue": [(L) => g.selected = L, (L) => l(g)]
+                e.selectable ? (a(), s("td", $t, [
+                  L(ve, {
+                    modelValue: u.selected,
+                    "onUpdate:modelValue": [(E) => u.selected = E, (E) => ae(u)]
                   }, null, 8, ["modelValue", "onUpdate:modelValue"])
-                ])) : k("", !0),
-                (a(!0), n(E, null, q(f.value, (L, se) => (a(), n(E, { key: se }, [
-                  L.visible ? (a(), n("td", {
+                ])) : w("", !0),
+                (a(!0), s(R, null, q(f.value, (E, se) => (a(), s(R, { key: se }, [
+                  E.visible ? (a(), s("td", {
                     key: 0,
-                    class: F(["dsg-table--tbody-cell", L.dataClass]),
-                    style: X({ width: L.width || void 0 }),
+                    class: M(["dsg-table--tbody-cell", E.dataClass]),
+                    style: J({ width: E.width || void 0 }),
                     onClick: (ue) => $e(),
                     onDblclick: (ue) => Ce(),
                     onContextmenu: (ue) => De()
                   }, [
-                    T(e.$slots, ae(L), {
-                      rowData: g,
-                      rowIndex: R,
-                      rowField: L
+                    T(e.$slots, _(E), {
+                      rowData: u,
+                      rowIndex: I,
+                      rowField: E
                     }, () => [
-                      m("span", {
-                        innerHTML: ee(L, g)
+                      y("span", {
+                        innerHTML: te(E, u)
                       }, null, 8, Dt)
                     ])
-                  ], 46, Ct)) : k("", !0)
+                  ], 46, Ct)) : w("", !0)
                 ], 64))), 128))
               ], 42, Pt),
               e.hasDetailRow ? (a(), N(Le, {
                 key: 0,
                 name: e.detailRowTransition
               }, {
-                default: x(() => [
-                  m("tr", {
+                default: Z(() => [
+                  y("tr", {
                     class: "dsg-table--tbody-detail-row",
-                    onClick: (L) => Te()
+                    onClick: (E) => Te()
                   }, [
-                    m("td", { colspan: Q.value }, [
+                    y("td", { colspan: Q.value }, [
                       T(e.$slots, "dsg-table-detail-row", {
-                        rowData: g,
-                        rowIndex: R,
+                        rowData: u,
+                        rowIndex: I,
                         options: e.detailRowOptions
                       })
                     ], 8, St)
                   ], 8, Tt)
                 ]),
                 _: 2
-              }, 1032, ["name"])) : k("", !0)
+              }, 1032, ["name"])) : w("", !0)
             ], 64))), 128)),
-            !b.value?.length && e.noDataTemplate.length ? (a(), n("tr", Ft, [
-              m("td", {
+            !v.value?.length && e.noDataTemplate.length ? (a(), s("tr", Ft, [
+              y("td", {
                 colspan: Q.value,
                 class: "dsg-table--empty-result"
               }, [
                 T(e.$slots, "dsg-table-empty-result", {}, () => [
-                  Ee(_(e.noDataTemplate), 1)
+                  Ee(x(e.noDataTemplate), 1)
                 ])
               ], 8, Bt)
-            ])) : k("", !0)
+            ])) : w("", !0)
           ], 2),
-          m("tfoot", Mt, [
+          y("tfoot", Mt, [
             T(e.$slots, "dsg-table-footer", {
               fields: f.value,
-              data: b.value
+              data: v.value
             })
           ])
         ], 2)
@@ -700,10 +700,12 @@ You can explicitly suppress this warning by setting pagination-path="".`
   class: "dsg-table--pre-header"
 }, Ht = { class: "dsg-table--pre-header-left" }, It = ["textContent"], zt = { class: "dsg-table--pre-header-right" }, At = {
   key: 1,
-  class: "dsg-table--search-header"
+  class: "dsg-table--search-header",
+  ref: "dsgTableSearchHeaderEl"
 }, Vt = { class: "dsg-table--search-top" }, Ot = {
   key: 2,
-  class: "dsg-table--footer"
+  class: "dsg-table--footer",
+  ref: "dsgTableFooterEl"
 }, Ut = { class: "dsg-table--footer-left" }, qt = { class: "dsg-table--footer-center" }, Nt = { class: "dsg-table--footer-right" }, Wt = /* @__PURE__ */ W({
   __name: "DsgTable",
   props: {
@@ -724,178 +726,181 @@ You can explicitly suppress this warning by setting pagination-path="".`
     tableLayout: { default: "fixed" },
     data: { default: null },
     hasHeader: { type: Boolean, default: !0 },
-    hasFooter: { type: Boolean, default: !0 }
+    hasFooter: { type: Boolean, default: !0 },
+    css: { default: () => ({ tableWrapper: "border-b" }) }
   },
-  emits: ["dsg-table:action-edit", "dsg-table:action-view", "dsg-table:action-delete", "dsg-table:action-archive", "dsg-table:link-clicked", "dsg-table:rows-selected", "dsg-table:filter-updated", "dsg-table:term-changed"],
-  setup(t, { expose: $, emit: v }) {
-    const i = (l) => {
-      d.value = l;
-    }, f = y(!!(t.filterEntity || t.filterEndpoint)), b = () => {
+  emits: ["dsg-table:action-edit", "dsg-table:action-view", "dsg-table:action-delete", "dsg-table:action-archive", "dsg-table:link-clicked", "dsg-table:rows-selected", "dsg-table:filter-updated", "dsg-table:term-changed", "dsg-table:data-loaded"],
+  setup(t, { expose: $, emit: g }) {
+    const r = (l) => {
+      c.value = l;
+    }, f = k(!!(t.filterEntity || t.filterEndpoint)), v = () => {
       if (f.value) {
         let l = {};
-        return Ne().forEach((c) => {
-          if (c.key.startsWith("filter[")) {
-            const P = c.key.replace("filter[", "").replace("]", ""), S = c.value;
-            l[`filter[${P}]`] = S.join(",");
+        return Ne().forEach((d) => {
+          if (d.key.startsWith("filter[")) {
+            const P = d.key.replace("filter[", "").replace("]", ""), F = d.value;
+            l[`filter[${P}]`] = F.join(",");
           }
         }), l;
       } else
         return {};
-    }, h = Re(), p = y(!0), H = y(null), V = y("<p>Showing {from} to {to} of {total}</p>"), r = y(null), w = ge("dsgTable"), s = y({ perPage: 20, change: i }), d = y(20), u = y({ ...b(), ...t.initialFilters }), C = v, I = (l) => {
-      w.value?.changePage(l);
-    }, D = (l) => {
-      r.value = l;
-    }, j = ({ data: l }) => {
-      H.value = l;
-    }, K = () => {
-      p.value === !1 && w.value?.reload();
-    }, Q = (l) => {
-      w.value?.setData(
-        w.value?.tableData.map((c) => c.id === l.id ? l : c)
+    }, h = V(() => ({
+      ...t.css,
+      tableWrapper: "border-b " + (t.css?.tableWrapper || "")
+    })), m = Re(), z = k(!0), H = k(null), p = k("<p>Showing {from} to {to} of {total}</p>"), b = k(null), n = ge("dsgTable"), i = k({ perPage: 20, change: r }), c = k(20), D = k({ ...v(), ...t.initialFilters }), S = g, C = (l) => {
+      n.value?.changePage(l);
+    }, j = (l) => {
+      b.value = l;
+    }, K = ({ data: l }) => {
+      H.value = l, S("dsg-table:data-loaded", l);
+    }, Q = () => {
+      z.value === !1 && n.value?.reload();
+    }, A = (l) => {
+      n.value?.setData(
+        n.value?.tableData.map((d) => d.id === l.id ? l : d)
       );
-    }, z = (l) => {
-      u.value = l;
-    }, ee = (l) => {
-      u.value["filter[term]"] = l, C("dsg-table:term-changed", l);
-    }, ae = (l, c, P) => {
-      u.value = { "filter[term]": u.value["filter[term]"], ...l }, C("dsg-table:filter-updated", u.value, c, P);
+    }, te = (l) => {
+      D.value = l;
+    }, _ = (l) => {
+      D.value["filter[term]"] = l, S("dsg-table:term-changed", l);
+    }, ae = (l, d, P) => {
+      D.value = { "filter[term]": D.value["filter[term]"], ...l }, S("dsg-table:filter-updated", D.value, d, P);
     };
     return $({
-      reloadTable: K,
-      updateRowTable: Q,
-      termChanged: ee,
-      setFilters: z
-    }), (l, c) => (a(), n("div", Et, [
-      l.hasHeader ? (a(), n("div", Rt, [
+      reloadTable: Q,
+      updateRowTable: A,
+      termChanged: _,
+      setFilters: te
+    }), (l, d) => (a(), s("div", Et, [
+      l.hasHeader ? (a(), s("div", Rt, [
         T(l.$slots, "dsg-table--pre-header", {}, () => [
-          m("div", Ht, [
+          y("div", Ht, [
             T(l.$slots, "dsg-table--page-title", {
               data: H.value,
               title: l.title
             }, () => [
-              l.title.length > 0 ? (a(), n("h1", {
+              l.title.length > 0 ? (a(), s("h1", {
                 key: 0,
                 class: "dsg-table--title",
-                textContent: _(l.title)
-              }, null, 8, It)) : k("", !0)
+                textContent: x(l.title)
+              }, null, 8, It)) : w("", !0)
             ])
           ]),
-          m("div", zt, [
+          y("div", zt, [
             T(l.$slots, "dsg-table--page-actions", { data: H.value })
           ])
         ])
-      ])) : k("", !0),
-      l.displayPaginationInfo ? (a(), n("div", At, [
-        m("div", Vt, [
+      ])) : w("", !0),
+      l.displayPaginationInfo ? (a(), s("div", At, [
+        y("div", Vt, [
           T(l.$slots, "dsg-table--search-header", { data: H.value }, () => [
-            B(me, {
+            L(me, {
               name: "term",
-              "onDsgTable:termChanged": c[0] || (c[0] = (P) => ee(P))
+              "onDsgTable:termChanged": d[0] || (d[0] = (P) => _(P))
             }),
-            B(be, {
+            L(be, {
               entity: l.filterEntity,
               "filter-endpoint": l.filterEndpoint,
               "search-endpoint": l.filterSearchEndpoint,
               filters: l.filters,
-              "onDsgTable:filterUpdated": c[1] || (c[1] = (P, S, M) => ae(P, S, M))
+              "onDsgTable:filterUpdated": d[1] || (d[1] = (P, F, B) => ae(P, F, B))
             }, null, 8, ["entity", "filter-endpoint", "search-endpoint", "filters"]),
             T(l.$slots, "dsg-table--search-actions", { data: H.value })
           ])
         ]),
         T(l.$slots, "dsg-table--search-navigation")
-      ])) : k("", !0),
-      B(Lt, {
+      ], 512)) : w("", !0),
+      L(Lt, {
         ref: "dsgTable",
         "api-url": l.getUrl,
-        "filter-params": u.value,
-        "onUpdate:filterParams": c[7] || (c[7] = (P) => u.value = P),
-        "per-page": d.value,
-        "onUpdate:perPage": c[8] || (c[8] = (P) => d.value = P),
+        "filter-params": D.value,
+        "onUpdate:filterParams": d[7] || (d[7] = (P) => D.value = P),
+        "per-page": c.value,
+        "onUpdate:perPage": d[8] || (d[8] = (P) => c.value = P),
         fields: l.fields,
         "load-on-start": l.loadOnStart,
         "pagination-path": "meta",
         selectable: l.selectable,
         "track-by": l.trackBy,
         "table-layout": l.tableLayout,
-        css: { tableWrapper: "border-b" },
+        css: h.value,
         data: l.data,
-        "onDsgTable:loading": c[9] || (c[9] = (P) => p.value = !0),
-        "onDsgTable:loaded": c[10] || (c[10] = (P) => p.value = !1),
-        "onDsgTable:paginationData": D,
-        "onDsgTable:loadSuccess": j,
-        "onDsgTable:rowsSelected": c[11] || (c[11] = (P) => C("dsg-table:rows-selected", P))
+        "onDsgTable:loading": d[9] || (d[9] = (P) => z.value = !0),
+        "onDsgTable:loaded": d[10] || (d[10] = (P) => z.value = !1),
+        "onDsgTable:paginationData": j,
+        "onDsgTable:loadSuccess": K,
+        "onDsgTable:rowsSelected": d[11] || (d[11] = (P) => S("dsg-table:rows-selected", P))
       }, He({
-        "dsg-field--actions": x((P) => [
+        "dsg-field--actions": Z((P) => [
           T(l.$slots, "dsg-table-actions", { data: P }, () => [
             (a(), N(he, {
               key: P.rowIndex,
               data: P,
-              "onDsgTable:actionEdit": c[2] || (c[2] = (S, M) => C("dsg-table:action-edit", S, M)),
-              "onDsgTable:actionView": c[3] || (c[3] = (S, M) => C("dsg-table:action-view", S, M)),
-              "onDsgTable:actionDelete": c[4] || (c[4] = (S, M) => C("dsg-table:action-delete", S, M)),
-              "onDsgTable:actionArchive": c[5] || (c[5] = (S, M) => C("dsg-table:action-archive", S, M)),
-              "onDsgTable:linkClicked": c[6] || (c[6] = (S, M, J) => C("dsg-table:link-clicked", S, M, J))
+              "onDsgTable:actionEdit": d[2] || (d[2] = (F, B) => S("dsg-table:action-edit", F, B)),
+              "onDsgTable:actionView": d[3] || (d[3] = (F, B) => S("dsg-table:action-view", F, B)),
+              "onDsgTable:actionDelete": d[4] || (d[4] = (F, B) => S("dsg-table:action-delete", F, B)),
+              "onDsgTable:actionArchive": d[5] || (d[5] = (F, B) => S("dsg-table:action-archive", F, B)),
+              "onDsgTable:linkClicked": d[6] || (d[6] = (F, B, le) => S("dsg-table:link-clicked", F, B, le))
             }, null, 8, ["data"]))
           ])
         ]),
         _: 2
       }, [
-        q(U(h), (P, S) => ({
-          name: S,
-          fn: x(({ rowData: M, rowField: J, rowIndex: le }) => [
-            String(S) !== "dsg-field--actions" ? T(l.$slots, S, Ie(ze({ key: 0 }, { rowData: M, rowField: J, rowIndex: le }))) : k("", !0)
+        q(U(m), (P, F) => ({
+          name: F,
+          fn: Z((B) => [
+            String(F) !== "dsg-field--actions" ? T(l.$slots, F, Ie(ze({ key: 0 }, B))) : w("", !0)
           ])
         }))
-      ]), 1032, ["api-url", "filter-params", "per-page", "fields", "load-on-start", "selectable", "track-by", "table-layout", "data"]),
-      l.hasFooter ? (a(), n("div", Ot, [
-        m("div", Ut, [
+      ]), 1032, ["api-url", "filter-params", "per-page", "fields", "load-on-start", "selectable", "track-by", "table-layout", "css", "data"]),
+      l.hasFooter ? (a(), s("div", Ot, [
+        y("div", Ut, [
           T(l.$slots, "dsg-table--footer-left", {
-            data: r.value,
-            perPage: s.value
+            data: b.value,
+            perPage: i.value
           }, () => [
-            B(pe, {
-              "no-data-template": "",
+            L(pe, {
               ref: "paginationInfoStart",
-              pagination: r.value,
-              "onUpdate:pagination": c[12] || (c[12] = (P) => r.value = P),
-              "info-template": V.value
+              pagination: b.value,
+              "onUpdate:pagination": d[12] || (d[12] = (P) => b.value = P),
+              "info-template": p.value
             }, null, 8, ["pagination", "info-template"]),
             T(l.$slots, "dsg-table--footer-left-extras", {
-              data: r.value,
-              perPage: s.value
+              data: b.value,
+              perPage: i.value
             })
           ])
         ]),
-        m("div", qt, [
+        y("div", qt, [
           T(l.$slots, "dsg-table--footer-center", {
-            data: r.value,
-            perPage: s.value
+            data: b.value,
+            perPage: i.value
           }, () => [
             T(l.$slots, "dsg-table--footer-center-extras", {
-              data: r.value,
-              perPage: s.value
+              data: b.value,
+              perPage: i.value
             })
           ])
         ]),
-        m("div", Nt, [
+        y("div", Nt, [
           T(l.$slots, "dsg-table--footer-right", {
-            data: r.value,
-            perPage: s.value
+            data: b.value,
+            perPage: i.value
           }, () => [
-            p.value === !1 ? (a(), N(fe, {
+            z.value === !1 ? (a(), N(fe, {
               key: 0,
               ref: "pagination",
-              pagination: r.value,
-              "onUpdate:pagination": c[13] || (c[13] = (P) => r.value = P),
-              "onDsgTable:changePage": I
-            }, null, 8, ["pagination"])) : k("", !0),
+              pagination: b.value,
+              "onUpdate:pagination": d[13] || (d[13] = (P) => b.value = P),
+              "onDsgTable:changePage": C
+            }, null, 8, ["pagination"])) : w("", !0),
             T(l.$slots, "dsg-table--footer-right-extras", {
-              data: r.value,
-              perPage: s.value
+              data: b.value,
+              perPage: i.value
             })
           ])
         ])
-      ])) : k("", !0)
+      ], 512)) : w("", !0)
     ]));
   }
 }), jt = { class: "dsg-table--per-page" }, Kt = ["value", "textContent"], Qt = /* @__PURE__ */ W({
@@ -905,16 +910,16 @@ You can explicitly suppress this warning by setting pagination-path="".`
     perPage: {}
   },
   setup(t) {
-    return ($, v) => (a(), n("div", jt, [
-      oe(m("select", {
-        "onUpdate:modelValue": v[0] || (v[0] = (i) => $.perPage.perPage = i),
+    return ($, g) => (a(), s("div", jt, [
+      oe(y("select", {
+        "onUpdate:modelValue": g[0] || (g[0] = (r) => $.perPage.perPage = r),
         class: "dsg-table--per-page-select",
-        onChange: v[1] || (v[1] = (i) => $.perPage.change($.perPage.perPage))
+        onChange: g[1] || (g[1] = (r) => $.perPage.change($.perPage.perPage))
       }, [
-        (a(!0), n(E, null, q($.perPageOptions, (i) => (a(), n("option", {
-          key: i,
-          value: i,
-          textContent: _(i)
+        (a(!0), s(R, null, q($.perPageOptions, (r) => (a(), s("option", {
+          key: r,
+          value: r,
+          textContent: x(r)
         }, null, 8, Kt))), 128))
       ], 544), [
         [Ae, $.perPage.perPage]