@opengis/table 0.0.16 → 0.0.18

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { defineComponent as S, computed as f, createElementBlock as u, openBlock as s, toDisplayString as y, normalizeStyle as de, normalizeClass as m, Fragment as B, renderList as R, createElementVNode as d, createTextVNode as L, ref as w, useSlots as ve, watch as z, onMounted as ge, provide as Ce, createCommentVNode as j, createBlock as P, renderSlot as pe, resolveDynamicComponent as J, inject as $e, withDirectives as Te, vShow as Fe } from "vue";
-const Se = /* @__PURE__ */ S({
+import { defineComponent as S, computed as f, createElementBlock as u, openBlock as o, toDisplayString as h, normalizeStyle as ge, normalizeClass as m, Fragment as B, renderList as z, createElementVNode as d, createTextVNode as N, ref as w, useSlots as pe, watch as P, onMounted as fe, provide as $e, createCommentVNode as j, createBlock as L, renderSlot as V, resolveDynamicComponent as q, unref as ae, inject as Te, withDirectives as Fe, vShow as Se } from "vue";
+const De = /* @__PURE__ */ S({
   name: "NumberFormat",
   __name: "NumberFormat",
   props: {
@@ -11,9 +11,9 @@ const Se = /* @__PURE__ */ S({
     const a = b, e = f(() => a.value === null || a.value === void 0 ? "" : typeof a.value == "number" ? a.value.toFixed(2) : Intl.NumberFormat("uk-UA", {
       maximumFractionDigits: 2
     }).format(Number(a.value)));
-    return (c, r) => (s(), u("span", null, y(e.value), 1));
+    return (c, l) => (o(), u("span", null, h(e.value), 1));
   }
-}), De = /* @__PURE__ */ S({
+}), Ae = /* @__PURE__ */ S({
   name: "DateFormat",
   __name: "DateFormat",
   props: {
@@ -30,9 +30,9 @@ const Se = /* @__PURE__ */ S({
         return a.value;
       }
     });
-    return (c, r) => (s(), u("span", null, y(e.value), 1));
+    return (c, l) => (o(), u("span", null, h(e.value), 1));
   }
-}), Ae = /* @__PURE__ */ S({
+}), Ie = /* @__PURE__ */ S({
   name: "TextFormat",
   __name: "TextFormat",
   props: {
@@ -41,10 +41,10 @@ const Se = /* @__PURE__ */ S({
     column: {}
   },
   setup(b) {
-    const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((r) => r.text || r).join(",") : e?.text || e);
-    return (r, o) => (s(), u("span", null, y(c.value), 1));
+    const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((l) => l.text || l).join(",") : e?.text || e);
+    return (l, n) => (o(), u("span", null, h(c.value), 1));
   }
-}), Ie = /* @__PURE__ */ S({
+}), je = /* @__PURE__ */ S({
   name: "BadgeFormat",
   __name: "BadgeFormat",
   props: {
@@ -54,36 +54,36 @@ const Se = /* @__PURE__ */ S({
   },
   setup(b) {
     const a = b, e = f(() => {
-      const o = String(a.value || "").toLowerCase(), i = "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium";
-      return o.includes("success") || o.includes("active") || o.includes("completed") ? `${i} bg-green-100 text-green-800` : o.includes("error") || o.includes("failed") || o.includes("inactive") ? `${i} bg-red-100 text-red-800` : o.includes("warning") || o.includes("pending") ? `${i} bg-yellow-100 text-yellow-800` : o.includes("info") || o.includes("processing") ? `${i} bg-blue-100 text-blue-800` : a.value?.color && !/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(a.value.color) ? `${i} bg-${a.value.color}-100 text-${a.value.color}-800` : `${i} bg-gray-100 text-gray-800`;
+      const n = String(a.value || "").toLowerCase(), i = "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium";
+      return n.includes("success") || n.includes("active") || n.includes("completed") ? `${i} bg-green-100 text-green-800` : n.includes("error") || n.includes("failed") || n.includes("inactive") ? `${i} bg-red-100 text-red-800` : n.includes("warning") || n.includes("pending") ? `${i} bg-yellow-100 text-yellow-800` : n.includes("info") || n.includes("processing") ? `${i} bg-blue-100 text-blue-800` : a.value?.color && !/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(a.value.color) ? `${i} bg-${a.value.color}-100 text-${a.value.color}-800` : `${i} bg-gray-100 text-gray-800`;
     });
-    function c(o, i = 1) {
-      const _ = parseInt(o.slice(1, 3), 16), $ = parseInt(o.slice(3, 5), 16), T = parseInt(o.slice(5, 7), 16);
+    function c(n, i = 1) {
+      const _ = parseInt(n.slice(1, 3), 16), $ = parseInt(n.slice(3, 5), 16), T = parseInt(n.slice(5, 7), 16);
       return `rgba(${_}, ${$}, ${T}, ${i})`;
     }
-    const r = f(() => {
-      const o = {
+    const l = f(() => {
+      const n = {
         minWidth: "60px",
         textAlign: "center",
         display: "inline-block"
       };
       return /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(a.value?.color) ? {
-        ...o,
+        ...n,
         backgroundColor: c(a.value.color, 0.1),
         color: c(a.value.color, 0.8)
-      } : o;
+      } : n;
     });
-    return (o, i) => (s(), u("span", {
+    return (n, i) => (o(), u("span", {
       class: m(["badge", e.value]),
-      style: de(r.value)
-    }, y(o.value?.text || o.value), 7));
+      style: ge(l.value)
+    }, h(n.value?.text || n.value), 7));
   }
-}), je = (b, a) => {
+}), Be = (b, a) => {
   const e = b.__vccOpts || b;
-  for (const [c, r] of a)
-    e[c] = r;
+  for (const [c, l] of a)
+    e[c] = l;
   return e;
-}, Be = /* @__PURE__ */ je(Ie, [["__scopeId", "data-v-28700c64"]]), Re = { class: "flex flex-wrap gap-1" }, ze = /* @__PURE__ */ S({
+}, Re = /* @__PURE__ */ Be(je, [["__scopeId", "data-v-28700c64"]]), ze = { class: "flex flex-wrap gap-1" }, Pe = /* @__PURE__ */ S({
   name: "ArrayFormat",
   __name: "ArrayFormat",
   props: {
@@ -92,15 +92,15 @@ const Se = /* @__PURE__ */ S({
     column: {}
   },
   setup(b) {
-    const a = b, e = f(() => a.value ? Array.isArray(a.value) ? a.value : [a.value] : []), c = (r) => r ? typeof r == "object" && r.name ? r.name : typeof r == "string" || typeof r == "number" ? String(r) : JSON.stringify(r) : "";
-    return (r, o) => (s(), u("div", Re, [
-      (s(!0), u(B, null, R(e.value, (i, _) => (s(), u("span", {
+    const a = b, e = f(() => a.value ? Array.isArray(a.value) ? a.value : [a.value] : []), c = (l) => l ? typeof l == "object" && l.name ? l.name : typeof l == "string" || typeof l == "number" ? String(l) : JSON.stringify(l) : "";
+    return (l, n) => (o(), u("div", ze, [
+      (o(!0), u(B, null, z(e.value, (i, _) => (o(), u("span", {
         key: _,
         class: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800 hover:bg-blue-200 transition-colors"
-      }, y(c(i)), 1))), 128))
+      }, h(c(i)), 1))), 128))
     ]));
   }
-}), Pe = ["href", "target"], Le = /* @__PURE__ */ S({
+}), Le = ["href", "target"], Ne = /* @__PURE__ */ S({
   __name: "LinkFormat",
   props: {
     href: { default: "" },
@@ -111,23 +111,23 @@ const Se = /* @__PURE__ */ S({
     column: {}
   },
   setup(b) {
-    const a = b, e = f(() => typeof a.value == "string" || typeof a.value == "number" ? a.value : a.value?.text || a.value?.label || "Link"), c = f(() => a.href ? a.href : typeof a.value == "object" && a.value?.href ? a.value.href : ""), r = f(() => a.target ? a.target : typeof a.value == "object" && a.value?.target ? a.value.target : "_self"), o = f(() => "text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 underline cursor-pointer"), i = (_) => {
+    const a = b, e = f(() => typeof a.value == "string" || typeof a.value == "number" ? a.value : a.value?.text || a.value?.label || "Link"), c = f(() => a.href ? a.href : typeof a.value == "object" && a.value?.href ? a.value.href : ""), l = f(() => a.target ? a.target : typeof a.value == "object" && a.value?.target ? a.value.target : "_self"), n = f(() => "text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 underline cursor-pointer"), i = (_) => {
       a.onClick && a.row && (_.preventDefault(), a.onClick(a.row, a.value));
     };
-    return (_, $) => c.value ? (s(), u("a", {
+    return (_, $) => c.value ? (o(), u("a", {
       key: 0,
       href: c.value,
-      target: r.value,
-      class: m(o.value),
+      target: l.value,
+      class: m(n.value),
       onClick: i
-    }, y(e.value), 11, Pe)) : (s(), u("button", {
+    }, h(e.value), 11, Le)) : (o(), u("button", {
       key: 1,
       type: "button",
-      class: m(o.value),
+      class: m(n.value),
       onClick: i
-    }, y(e.value), 3));
+    }, h(e.value), 3));
   }
-}), Ne = /* @__PURE__ */ S({
+}), Ve = /* @__PURE__ */ S({
   name: "TextFormat",
   __name: "SelectFormat",
   props: {
@@ -136,18 +136,18 @@ const Se = /* @__PURE__ */ S({
     column: {}
   },
   setup(b) {
-    const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((r) => r.text || r).filter((r, o) => o < 2).join(", ") + (e.length > 2 ? ` +${e.length - 2}` : "") : e?.text || e);
-    return (r, o) => (s(), u("span", null, y(c.value), 1));
+    const a = b, { value: e } = a, c = f(() => Array.isArray(e) ? e.map((l) => l.text || l).filter((l, n) => n < 2).join(", ") + (e.length > 2 ? ` +${e.length - 2}` : "") : e?.text || e);
+    return (l, n) => (o(), u("span", null, h(c.value), 1));
   }
-}), ue = {
-  number: Se,
-  date: De,
-  text: Ae,
-  badge: Be,
-  array: ze,
-  select: Ne,
-  link: Le
-}, Ve = { class: "flex items-center space-x-4" }, Me = { class: "font-medium" }, Ee = { class: "font-medium" }, He = { class: "font-medium" }, We = { class: "flex items-center space-x-2" }, Ue = ["disabled"], Oe = { class: "flex items-center space-x-1" }, Je = ["onClick"], qe = ["disabled"], fe = /* @__PURE__ */ S({
+}), de = {
+  number: De,
+  date: Ae,
+  text: Ie,
+  badge: Re,
+  array: Pe,
+  select: Ve,
+  link: Ne
+}, Me = { class: "flex items-center space-x-4" }, Ee = { class: "font-medium" }, He = { class: "font-medium" }, We = { class: "font-medium" }, Ue = { class: "flex items-center space-x-2" }, Oe = ["disabled"], Je = { class: "flex items-center space-x-1" }, qe = ["onClick"], Ge = ["disabled"], me = /* @__PURE__ */ S({
   name: "Pagination",
   __name: "Pagination",
   props: {
@@ -175,7 +175,7 @@ const Se = /* @__PURE__ */ S({
         button: "px-4 h-11 text-base min-w-[44px] flex items-center justify-center",
         icon: "w-5 h-5"
       }
-    })[e.size]), r = f(() => {
+    })[e.size]), l = f(() => {
       const { theme: p } = e;
       return p === "dark" ? {
         container: "bg-gray-900 border-gray-700",
@@ -199,7 +199,7 @@ const Se = /* @__PURE__ */ S({
         buttonActive: "bg-blue-600 text-white",
         ellipsis: "text-gray-500 dark:text-gray-400"
       };
-    }), o = a, i = f(() => Math.ceil(e.total / e.limit)), _ = f(() => e.total === 0 ? 0 : (e.page - 1) * e.limit + 1), $ = f(() => Math.min(e.page * e.limit, e.total)), T = f(() => {
+    }), n = a, i = f(() => Math.ceil(e.total / e.limit)), _ = f(() => e.total === 0 ? 0 : (e.page - 1) * e.limit + 1), $ = f(() => Math.min(e.page * e.limit, e.total)), T = f(() => {
       const p = [];
       if (i.value <= 7)
         for (let k = 1; k <= i.value; k += 1)
@@ -213,42 +213,42 @@ const Se = /* @__PURE__ */ S({
       }
       return p;
     }), D = (p) => {
-      p >= 1 && p <= i.value && p !== e.page && o("update:page", p);
+      p >= 1 && p <= i.value && p !== e.page && n("update:page", p);
     };
-    return (p, h) => (s(), u("div", {
-      class: m(["flex items-center justify-between py-3 border-t", r.value.container])
+    return (p, y) => (o(), u("div", {
+      class: m(["flex items-center justify-between py-3 border-t", l.value.container])
     }, [
-      d("div", Ve, [
+      d("div", Me, [
         d("div", {
-          class: m(["flex items-center text-sm", r.value.text, c.value.text])
+          class: m(["flex items-center text-sm", l.value.text, c.value.text])
         }, [
           d("span", null, [
-            h[2] || (h[2] = L(" Показано ", -1)),
-            d("span", Me, y(_.value), 1),
-            h[3] || (h[3] = L(" до ", -1)),
-            d("span", Ee, y($.value), 1),
-            h[4] || (h[4] = L(" з ", -1)),
-            d("span", He, y(p.total), 1),
-            h[5] || (h[5] = L(" результатів ", -1))
+            y[2] || (y[2] = N(" Показано ", -1)),
+            d("span", Ee, h(_.value), 1),
+            y[3] || (y[3] = N(" до ", -1)),
+            d("span", He, h($.value), 1),
+            y[4] || (y[4] = N(" з ", -1)),
+            d("span", We, h(p.total), 1),
+            y[5] || (y[5] = N(" результатів ", -1))
           ])
         ], 2)
       ]),
-      d("div", We, [
+      d("div", Ue, [
         d("button", {
-          onClick: h[0] || (h[0] = (k) => D(p.page - 1)),
+          onClick: y[0] || (y[0] = (k) => D(p.page - 1)),
           disabled: p.page <= 1,
           class: m([
             "relative font-medium rounded-md",
             c.value.button,
-            p.page <= 1 ? r.value.buttonDisabled : r.value.button
+            p.page <= 1 ? l.value.buttonDisabled : l.value.button
           ])
         }, [
-          (s(), u("svg", {
+          (o(), u("svg", {
             class: m(c.value.icon),
             fill: "none",
             stroke: "currentColor",
             viewBox: "0 0 24 24"
-          }, h[6] || (h[6] = [
+          }, y[6] || (y[6] = [
             d("path", {
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
@@ -256,38 +256,38 @@ const Se = /* @__PURE__ */ S({
               d: "M15 19l-7-7 7-7"
             }, null, -1)
           ]), 2))
-        ], 10, Ue),
-        d("div", Oe, [
-          (s(!0), u(B, null, R(T.value, (k) => (s(), u(B, { key: k }, [
-            k === "..." ? (s(), u("span", {
+        ], 10, Oe),
+        d("div", Je, [
+          (o(!0), u(B, null, z(T.value, (k) => (o(), u(B, { key: k }, [
+            k === "..." ? (o(), u("span", {
               key: 0,
-              class: m(["font-medium", c.value.button, r.value.ellipsis])
-            }, " ... ", 2)) : (s(), u("button", {
+              class: m(["font-medium", c.value.button, l.value.ellipsis])
+            }, " ... ", 2)) : (o(), u("button", {
               key: 1,
               onClick: (F) => D(k),
               class: m([
                 "relative font-medium rounded-md",
                 c.value.button,
-                k === p.page ? r.value.buttonActive : r.value.button
+                k === p.page ? l.value.buttonActive : l.value.button
               ])
-            }, y(k), 11, Je))
+            }, h(k), 11, qe))
           ], 64))), 128))
         ]),
         d("button", {
-          onClick: h[1] || (h[1] = (k) => D(p.page + 1)),
+          onClick: y[1] || (y[1] = (k) => D(p.page + 1)),
           disabled: p.page >= i.value,
           class: m([
             "relative font-medium rounded-md",
             c.value.button,
-            p.page >= i.value ? r.value.buttonDisabled : r.value.button
+            p.page >= i.value ? l.value.buttonDisabled : l.value.button
           ])
         }, [
-          (s(), u("svg", {
+          (o(), u("svg", {
             class: m(c.value.icon),
             fill: "none",
             stroke: "currentColor",
             viewBox: "0 0 24 24"
-          }, h[7] || (h[7] = [
+          }, y[7] || (y[7] = [
             d("path", {
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
@@ -295,20 +295,26 @@ const Se = /* @__PURE__ */ S({
               d: "M9 5l7 7-7 7"
             }, null, -1)
           ]), 2))
-        ], 10, qe)
+        ], 10, Ge)
       ])
     ], 2));
   }
-}), Ge = {
+}), Ke = {
   key: 0,
   class: "text-center py-8"
-}, Ke = { class: "inline-flex items-center space-x-2" }, Qe = {
+}, Qe = { class: "inline-flex items-center space-x-2" }, Xe = {
   key: 2,
   class: "overflow-x-auto"
-}, Xe = ["checked", "indeterminate"], Ye = ["onClick"], Ze = { class: "flex items-center justify-between" }, et = {
+}, Ye = ["checked", "indeterminate"], Ze = ["onClick"], et = { class: "flex items-center justify-between" }, tt = {
   key: 0,
   class: "ml-1 text-xs"
-}, tt = { key: 1 }, at = ["onClick"], rt = ["checked", "onChange"], lt = ["onClick"], ce = /* @__PURE__ */ S({
+}, at = {
+  key: 1,
+  class: "w-[100px]"
+}, rt = ["onClick"], lt = ["checked", "onChange"], st = ["onClick"], nt = {
+  key: 1,
+  class: "text-center"
+}, ve = /* @__PURE__ */ S({
   name: "DataTable",
   __name: "DataTable",
   props: {
@@ -316,15 +322,17 @@ const Se = /* @__PURE__ */ S({
     columns: { default: () => [] },
     api: {},
     router: {},
-    tableStyle: { default: "min-width: 50rem" },
-    tableClass: { default: "min-w-full divide-y divide-gray-200 dark:divide-gray-700" },
-    tableClassWrapper: {},
+    tableStyle: { default: "" },
     size: { default: "medium" },
     theme: { default: "light" },
     loading: { type: Boolean, default: !1 },
+    classWrapper: { default: "" },
+    classTable: { default: "min-w-full divide-y divide-gray-200 dark:divide-gray-700" },
+    classTbody: { default: "" },
     classTr: { default: "" },
     classTd: { default: "" },
     classTh: { default: "" },
+    classThead: { default: "" },
     classLink: { default: "" },
     selectable: { type: Boolean, default: !1 },
     selectedRows: { default: () => [] },
@@ -338,7 +346,7 @@ const Se = /* @__PURE__ */ S({
   },
   emits: ["update:page", "update:selectedRows", "row-click", "sort"],
   setup(b, { emit: a }) {
-    const e = b, c = a, r = w(e.selectedRows || []), o = w([]), i = w([]), _ = w([]), $ = w(!1), T = w(null), D = w(e.router), p = ve(), h = f(() => p.action);
+    const e = b, c = a, l = w(e.selectedRows || []), n = w([]), i = w([]), _ = w([]), $ = w(!1), T = w(null), D = w(e.router), p = pe(), y = f(() => p.action);
     function k(t) {
       if (D.value) {
         D.value.push(t);
@@ -349,51 +357,51 @@ const Se = /* @__PURE__ */ S({
     const F = f(() => {
       if (e.api)
         return i.value;
-      if (e.sortable && o.value.length > 0) {
+      if (e.sortable && n.value.length > 0) {
         const t = [...e.rows];
-        return t.sort((v, l) => {
-          for (const g of o.value) {
+        return t.sort((v, r) => {
+          for (const g of n.value) {
             if (!g.direction)
               return 0;
-            const n = v[g.field], x = l[g.field];
-            if (n == null) return 1;
+            const s = v[g.field], x = r[g.field];
+            if (s == null) return 1;
             if (x == null) return -1;
             let I = 0;
-            typeof n == "string" && typeof x == "string" ? I = n.localeCompare(x) : n < x ? I = -1 : n > x ? I = 1 : I = 0;
-            const O = g.direction === "desc" ? -I : I;
-            if (O !== 0) return O;
+            typeof s == "string" && typeof x == "string" ? I = s.localeCompare(x) : s < x ? I = -1 : s > x ? I = 1 : I = 0;
+            const J = g.direction === "desc" ? -I : I;
+            if (J !== 0) return J;
           }
           return 0;
         }), t;
       }
       return e.rows;
     });
-    z(() => e.selectedRows, (t) => {
-      r.value = t || [];
+    P(() => e.selectedRows, (t) => {
+      l.value = t || [];
     });
-    const A = (t) => r.value.some((v) => v === t), te = (t) => {
-      const v = r.value.findIndex((l) => l === t);
-      v > -1 ? r.value.splice(v, 1) : r.value.push(t), c("update:selectedRows", [...r.value]);
-    }, q = f(() => F.value.length > 0 && r.value.length === F.value.length), N = f(() => r.value.length > 0 && r.value.length < F.value.length), G = () => {
-      q.value ? r.value = [] : r.value = [...F.value], c("update:selectedRows", [...r.value]);
-    }, me = (t) => {
+    const A = (t) => l.value.some((v) => v === t), re = (t) => {
+      const v = l.value.findIndex((r) => r === t);
+      v > -1 ? l.value.splice(v, 1) : l.value.push(t), c("update:selectedRows", [...l.value]);
+    }, G = f(() => F.value.length > 0 && l.value.length === F.value.length), M = f(() => l.value.length > 0 && l.value.length < F.value.length), K = () => {
+      G.value ? l.value = [] : l.value = [...F.value], c("update:selectedRows", [...l.value]);
+    }, be = (t) => {
       if (!e.sortable) return;
-      const v = o.value.findIndex((g) => g.field === t);
+      const v = n.value.findIndex((g) => g.field === t);
       if (v >= 0) {
-        const g = o.value[v];
-        g.direction === "asc" ? g.direction = "desc" : g.direction === "desc" && o.value.splice(v, 1);
+        const g = n.value[v];
+        g.direction === "asc" ? g.direction = "desc" : g.direction === "desc" && n.value.splice(v, 1);
       } else
-        o.value.unshift({
+        n.value.unshift({
           field: t,
           direction: "asc"
         });
-      const l = o.value.filter((g) => g.direction).map((g) => ({
+      const r = n.value.filter((g) => g.direction).map((g) => ({
         name: g.field,
         asc: g.direction === "asc"
       }));
-      c("sort", l), e.api && H();
-    }, be = (t) => o.value.find((l) => l.field === t)?.direction === "asc", he = (t) => {
-      const v = o.value.find((l) => l.field === t);
+      c("sort", r), e.api && W();
+    }, ye = (t) => n.value.find((r) => r.field === t)?.direction === "asc", he = (t) => {
+      const v = n.value.find((r) => r.field === t);
       if (!v)
         return "↑↓";
       switch (v.direction) {
@@ -406,26 +414,26 @@ const Se = /* @__PURE__ */ S({
         default:
           return "↕️";
       }
-    }, K = (t) => e.sortable && t.sortable !== !1, ye = (t) => {
+    }, Q = (t) => e.sortable && t.sortable !== !1, xe = (t) => {
       e.clickable && c("row-click", t);
-    }, V = (t, v) => {
-      const l = v[t.name];
+    }, R = (t, v) => {
+      const r = v[t.name];
       if (e.getCellData || t.getCellData) {
         const g = t.getCellData || e.getCellData;
         if (g) {
-          const n = {
+          const s = {
             name: t.name,
             row: v,
-            value: l
+            value: r
           };
-          return g(n);
+          return g(s);
         }
       }
       return ["_data", "_text"].map((g) => {
-        const n = `${t.name}${g}`;
-        return v[n] ? v[n] : null;
-      }).find((g) => g) || l;
-    }, ae = (t) => t.width ? t.width === "w-full" ? "w-full" : typeof t.width == "string" ? t.width : typeof t.width == "number" ? `w-${t.width}` : "" : "", Q = w(e.page), re = w(e.limit), X = w(e.total), M = w(1), Y = w(10), E = w(0), le = f(() => e.api ? M.value : Q.value), ne = f(() => e.api ? Y.value : re.value), oe = f(() => e.api ? E.value : X.value), C = f(() => {
+        const s = `${t.name}${g}`;
+        return v[s] ? v[s] : null;
+      }).find((g) => g) || r;
+    }, le = (t) => t.width ? t.width === "w-full" ? "w-full" : typeof t.width == "string" ? `w-[${t.width}px]` : typeof t.width == "number" ? `w-[${t.width}px]` : "" : "", X = w(e.page), se = w(e.limit), Y = w(e.total), E = w(1), Z = w(10), H = w(0), ne = f(() => e.api ? E.value : X.value), oe = f(() => e.api ? Z.value : se.value), ie = f(() => e.api ? H.value : Y.value), C = f(() => {
       const { theme: t } = e;
       return t === "dark" ? {
         container: "dark",
@@ -465,27 +473,27 @@ const Se = /* @__PURE__ */ S({
         checkbox: "border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400"
       };
     });
-    z(() => e.page, (t) => {
-      Q.value = t;
-    }), z(() => e.limit, (t) => {
-      re.value = t;
-    }), z(() => e.total, (t) => {
+    P(() => e.page, (t) => {
       X.value = t;
+    }), P(() => e.limit, (t) => {
+      se.value = t;
+    }), P(() => e.total, (t) => {
+      Y.value = t;
     });
-    async function H() {
+    async function W() {
       if (e.api) {
         $.value = !0, T.value = null;
         try {
           const t = new URL(e.api, window.location.origin);
-          if (t.searchParams.set("page", le.value.toString()), t.searchParams.set("limit", ne.value.toString()), o.value.length > 0) {
-            const g = o.value.filter((n) => n.direction).map((n) => `${n.field}:${n.direction}`).join(",");
+          if (t.searchParams.set("page", ne.value.toString()), t.searchParams.set("limit", oe.value.toString()), n.value.length > 0) {
+            const g = n.value.filter((s) => s.direction).map((s) => `${s.field}:${s.direction}`).join(",");
             g && t.searchParams.set("sort", g);
           }
           const v = await fetch(t.toString());
           if (!v.ok)
             throw new Error(`HTTP error! status: ${v.status}`);
-          const l = await v.json();
-          l.rows && Array.isArray(l.rows) && (i.value = l.rows), l.columns && Array.isArray(l.columns) && (_.value = l.columns), l.total !== void 0 && (e.api ? E.value = l.total : X.value = l.total);
+          const r = await v.json();
+          r.rows && Array.isArray(r.rows) && (i.value = r.rows), r.columns && Array.isArray(r.columns) && (_.value = r.columns), r.total !== void 0 && (e.api ? H.value = r.total : Y.value = r.total);
         } catch (t) {
           T.value = t instanceof Error ? t.message : "Failed to fetch data", console.error("Error fetching data:", t);
         } finally {
@@ -493,9 +501,9 @@ const Se = /* @__PURE__ */ S({
         }
       }
     }
-    const xe = (t) => {
-      e.api ? M.value = t : (Q.value = t, c("update:page", t)), e.api && H();
-    }, ke = f(() => e.showPagination && oe.value > 0), W = f(() => ({
+    const ke = (t) => {
+      e.api ? E.value = t : (X.value = t, c("update:page", t)), e.api && W();
+    }, _e = f(() => e.showPagination && ie.value > 0), U = f(() => ({
       small: {
         header: "px-3 py-2 text-xs",
         cell: "px-3 py-2 text-xs"
@@ -509,36 +517,36 @@ const Se = /* @__PURE__ */ S({
         cell: "px-8 py-6 text-base"
       }
     })[e.size]);
-    ge(() => {
-      e.api && (e.page && (M.value = e.page), e.limit && (Y.value = e.limit), e.total && (E.value = e.total), H());
-    }), z(() => e.api, (t) => {
-      t && (M.value = e.page || 1, Y.value = e.limit || 10, E.value = e.total || 0, H());
+    fe(() => {
+      e.api && (e.page && (E.value = e.page), e.limit && (Z.value = e.limit), e.total && (H.value = e.total), W());
+    }), P(() => e.api, (t) => {
+      t && (E.value = e.page || 1, Z.value = e.limit || 10, H.value = e.total || 0, W());
     });
-    const _e = f(() => e.api ? _.value : e.columns), Z = w([]), U = w({});
-    Ce("registerColumn", (t, v) => {
-      Z.value.push(t), v && t.slotName && (U.value[t.name] = v);
+    const we = f(() => e.api ? _.value : e.columns), ee = w([]), O = w({});
+    $e("registerColumn", (t, v) => {
+      ee.value.push(t), v && t.slotName && (O.value[t.name] = v);
     });
-    const se = f(() => {
-      const t = _e.value || [], v = [], l = p.default?.();
-      if (l) {
-        const g = l.filter((n) => n.type?.name === "Column" || n.type === "Column" || n.type && typeof n.type == "object" && n.type.name === "Column").map((n) => {
-          const x = n.props || n.componentProps || {}, I = x.field || x.name || "", O = x.header || x.label || "", ie = n.children && n.children.body, ee = {
+    const ue = f(() => {
+      const t = we.value || [], v = [], r = p.default?.();
+      if (r) {
+        const g = r.filter((s) => s.type?.name === "Column" || s.type === "Column" || s.type && typeof s.type == "object" && s.type.name === "Column").map((s) => {
+          const x = s.props || s.componentProps || {}, I = x.field || x.name || "", J = x.header || x.label || "", ce = s.children && s.children.body, te = {
             name: I,
             // Use field as the name for data access
-            ua: O,
+            ua: J,
             // Use header as the display name
             format: x.format || "text",
-            slotName: ie ? "body" : void 0,
+            slotName: ce ? "body" : void 0,
             ...x
           };
-          return ie && ee.name && (U.value[ee.name] = n.children.body), ee;
+          return ce && te.name && (O.value[te.name] = s.children.body), te;
         });
         v.push(...g);
       }
-      if (Z.value.length > 0 && v.push(...Z.value), v.length > 0) {
-        const g = [], n = new Set(v.map((x) => x.name));
+      if (ee.value.length > 0 && v.push(...ee.value), v.length > 0) {
+        const g = [], s = new Set(v.map((x) => x.name));
         return t.forEach((x) => {
-          n.has(x.name) || g.push(x);
+          s.has(x.name) || g.push(x);
         }), g.push(...v), console.log("Combined columns:", {
           default: t.length,
           custom: v.length,
@@ -546,154 +554,165 @@ const Se = /* @__PURE__ */ S({
         }), g;
       }
       return t.length > 0 ? (console.log("Using default columns:", t.length), t) : [];
-    }), we = (t = "text") => ue[t] || ue.text;
-    return (t, v) => (s(), u("div", {
+    }), Ce = (t = "text") => de[t.toLowerCase()] || de.text;
+    return (t, v) => (o(), u("div", {
       class: m(["w-full", C.value.container])
     }, [
-      $.value || e.loading ? (s(), u("div", Ge, [
-        d("div", Ke, [
+      $.value || e.loading ? (o(), u("div", Ke, [
+        d("div", Qe, [
           v[0] || (v[0] = d("div", { class: "animate-spin rounded-full h-6 w-6 border-b-2 border-blue-600" }, null, -1)),
           d("span", {
             class: m(C.value.loading)
           }, "Loading...", 2)
         ])
-      ])) : T.value ? (s(), u("div", {
+      ])) : T.value ? (o(), u("div", {
         key: 1,
         class: m(["text-center py-8", C.value.error])
-      }, y(T.value), 3)) : !e.loading && F.value.length > 0 ? (s(), u("div", Qe, [
+      }, h(T.value), 3)) : !e.loading && F.value.length > 0 ? (o(), u("div", Xe, [
         d("div", {
-          class: m(t.tableClassWrapper ? t.tableClassWrapper : "relative w-full overflow-auto")
+          class: m(t.classWrapper ? t.classWrapper : "relative w-full overflow-auto")
         }, [
           d("table", {
-            class: m(t.tableClass),
-            style: de(t.tableStyle)
+            class: m(t.classTable),
+            style: ge(t.tableStyle)
           }, [
             d("thead", {
-              class: m(C.value.thead)
+              class: m(t.classThead || C.value.thead)
             }, [
               d("tr", null, [
-                t.selectable ? (s(), u("th", {
+                t.selectable ? (o(), u("th", {
                   key: 0,
-                  class: m(["text-left font-medium uppercase tracking-wider", C.value.th, W.value.header, e.classTh, "w-12"])
+                  class: m(["text-left font-medium uppercase tracking-wider", C.value.th, U.value.header, e.classTh, "w-12"])
                 }, [
                   d("input", {
                     type: "checkbox",
-                    checked: q.value,
-                    indeterminate: N.value,
-                    onChange: G,
+                    checked: G.value,
+                    indeterminate: M.value,
+                    onChange: K,
                     class: m(["h-4 w-4 focus:ring-blue-500 rounded", C.value.checkbox])
-                  }, null, 42, Xe)
+                  }, null, 42, Ye)
                 ], 2)) : j("", !0),
-                (s(!0), u(B, null, R(se.value.filter((l) => !l.hidden), (l) => (s(), u("th", {
-                  key: l.name,
+                (o(!0), u(B, null, z(ue.value.filter((r) => !r.hidden), (r) => (o(), u("th", {
+                  key: r.name,
                   class: m([
-                    "text-left font-medium uppercase tracking-wider",
-                    C.value.th,
-                    W.value.header,
-                    e.classTh,
-                    l.align ? `text-${l.align}` : "",
-                    K(l) ? ["cursor-pointer", C.value.thHover] : "",
-                    ae(l)
-                  ]),
-                  onClick: (g) => K(l) ? me(l.name) : void 0
+                    r.align ? `text-${r.align}` : "",
+                    Q(r) ? ["cursor-pointer", C.value.thHover] : "",
+                    le(r)
+                  ].concat(
+                    e.classTh || [
+                      "text-left font-medium uppercase tracking-wider",
+                      C.value.th,
+                      U.value.header
+                    ]
+                  )),
+                  onClick: (g) => Q(r) ? be(r.name) : void 0
                 }, [
-                  d("div", Ze, [
-                    d("span", null, y(l.ua || l.header || l.name), 1),
-                    K(l) ? (s(), u("span", et, [
-                      pe(t.$slots, "sort", {
-                        asc: be(l.name)
+                  d("div", et, [
+                    d("span", null, h(r.ua || r.header || r.name), 1),
+                    Q(r) ? (o(), u("span", tt, [
+                      V(t.$slots, "sort", {
+                        asc: ye(r.name)
                       }, () => [
-                        L(y(he(l.name)), 1)
+                        N(h(he(r.name)), 1)
                       ])
                     ])) : j("", !0)
                   ])
-                ], 10, Ye))), 128)),
-                h.value ? (s(), u("th", tt, "Дії")) : j("", !0)
+                ], 10, Ze))), 128)),
+                y.value ? (o(), u("th", at, "Дії")) : j("", !0)
               ])
             ], 2),
             d("tbody", {
-              class: m(C.value.tbody)
+              class: m(t.classTbody || C.value.tbody)
             }, [
-              (s(!0), u(B, null, R(F.value, (l, g) => (s(), u("tr", {
+              (o(!0), u(B, null, z(F.value, (r, g) => (o(), u("tr", {
                 key: g,
-                class: m([
+                class: m(e.classTr || [
                   C.value.tr,
-                  e.classTr,
                   e.clickable ? "cursor-pointer" : ""
                 ]),
-                onClick: (n) => e.clickable ? ye(l) : void 0
+                onClick: (s) => e.clickable ? xe(r) : void 0
               }, [
-                t.selectable ? (s(), u("td", {
+                t.selectable ? (o(), u("td", {
                   key: 0,
-                  class: m(["whitespace-nowrap", C.value.td, W.value.cell, e.classTd, "w-12"])
+                  class: m(["whitespace-nowrap", C.value.td, U.value.cell, e.classTd, "w-12"])
                 }, [
                   d("input", {
                     type: "checkbox",
-                    checked: A(l),
-                    onChange: (n) => te(l),
+                    checked: A(r),
+                    onChange: (s) => re(r),
                     class: m(["h-4 w-4 focus:ring-blue-500 rounded", C.value.checkbox])
-                  }, null, 42, rt)
+                  }, null, 42, lt)
                 ], 2)) : j("", !0),
-                (s(!0), u(B, null, R(se.value.filter((n) => !n.hidden), (n) => (s(), u("td", {
-                  key: n.name,
-                  class: m([
+                (o(!0), u(B, null, z(ue.value.filter((s) => !s.hidden), (s) => (o(), u("td", {
+                  key: s.name,
+                  class: m(e.classTd || [
                     "whitespace-nowrap",
                     C.value.td,
-                    W.value.cell,
-                    e.classTd,
-                    n.align ? `text-${n.align}` : "",
-                    ae(n)
+                    U.value.cell,
+                    s.align ? `text-${s.align}` : "",
+                    le(s)
                   ])
                 }, [
-                  n.action && h.value ? (s(), P(J(h.value), {
+                  s.action && y.value ? (o(), L(q(y.value), {
                     key: 0,
-                    row: l,
-                    value: V(n, l)
-                  }, null, 8, ["row", "value"])) : n.slotName && U.value[n.name] ? (s(), P(J(U.value[n.name]), {
+                    row: r,
+                    value: R(s, r)
+                  }, null, 8, ["row", "value"])) : ae(p).number && s.format === "number" ? V(t.$slots, "number", {
                     key: 1,
-                    data: l,
-                    value: V(n, l),
-                    row: l,
-                    column: n
-                  }, null, 8, ["data", "value", "row", "column"])) : n.link ? (s(), u("a", {
+                    row: r,
+                    value: R(s, r)
+                  }) : ae(p).badge && s.format === "badge" ? V(t.$slots, "badge", {
                     key: 2,
-                    class: m(t.classLink || "hover:text-blue-900 cursor-pointer text-blue-700 hover:underline"),
-                    onClick: (x) => k(n.link.replace("{id}", l.id))
-                  }, y(V(n, l)), 11, lt)) : (s(), P(J(we(n.format)), {
+                    row: r,
+                    value: R(s, r)
+                  }) : ae(p).array && s.format === "array" ? V(t.$slots, "array", {
                     key: 3,
-                    value: V(n, l),
-                    row: l,
-                    column: n,
-                    href: n.link
+                    row: r,
+                    value: R(s, r)
+                  }) : s.slotName && O.value[s.name] ? (o(), L(q(O.value[s.name]), {
+                    key: 4,
+                    data: r,
+                    value: R(s, r),
+                    row: r,
+                    column: s
+                  }, null, 8, ["data", "value", "row", "column"])) : s.link ? (o(), u("a", {
+                    key: 5,
+                    class: m(t.classLink || "hover:text-blue-900 cursor-pointer text-blue-700 hover:underline"),
+                    onClick: (x) => k(s.link.replace("{id}", r.id))
+                  }, h(R(s, r)), 11, st)) : (o(), L(q(Ce(s.format)), {
+                    key: 6,
+                    value: R(s, r),
+                    row: r,
+                    column: s,
+                    href: s.link
                   }, null, 8, ["value", "row", "column", "href"]))
                 ], 2))), 128)),
-                d("td", null, [
-                  h.value ? (s(), P(J(h.value), {
-                    key: 0,
-                    row: l
-                  }, null, 8, ["row"])) : j("", !0)
-                ])
-              ], 10, at))), 128))
+                y.value ? (o(), u("td", nt, [
+                  d("template", null, [
+                    (o(), L(q(y.value), { row: r }, null, 8, ["row"]))
+                  ])
+                ])) : j("", !0)
+              ], 10, rt))), 128))
             ], 2)
           ], 6)
         ], 2)
       ])) : j("", !0),
-      ke.value && !$.value && !e.loading && !T.value ? (s(), P(fe, {
+      _e.value && !$.value && !e.loading && !T.value ? (o(), L(me, {
         key: 3,
-        page: le.value,
-        limit: ne.value,
-        total: oe.value,
+        page: ne.value,
+        limit: oe.value,
+        total: ie.value,
         theme: e.theme,
         size: e.size,
-        "onUpdate:page": xe
+        "onUpdate:page": ke
       }, null, 8, ["page", "limit", "total", "theme", "size"])) : j("", !0),
-      !$.value && !e.loading && !T.value && F.value.length === 0 ? (s(), u("div", {
+      !$.value && !e.loading && !T.value && F.value.length === 0 ? (o(), u("div", {
         key: 4,
         class: m(["text-center py-8", C.value.empty])
       }, " Дані відсутні ", 2)) : j("", !0)
     ], 2));
   }
-}), nt = { style: { display: "none" } }, ot = /* @__PURE__ */ S({
+}), ot = { style: { display: "none" } }, it = /* @__PURE__ */ S({
   name: "Column",
   __name: "Column",
   props: {
@@ -714,42 +733,42 @@ const Se = /* @__PURE__ */ S({
     suffix: {}
   },
   setup(b) {
-    const a = b, e = ve(), c = $e("registerColumn");
-    return ge(() => {
+    const a = b, e = pe(), c = Te("registerColumn");
+    return fe(() => {
       if (c) {
         const {
-          field: r,
-          name: o,
+          field: l,
+          name: n,
           header: i,
           label: _,
           format: $,
           slotName: T,
           link: D,
           action: p,
-          getCellData: h,
+          getCellData: y,
           suffix: k,
           ...F
-        } = a, N = {
-          name: r || o || "",
+        } = a, M = {
+          name: l || n || "",
           ua: i || _ || "",
           format: $ || "text",
           slotName: T || (e.body ? "body" : void 0),
           // Use 'body' slot if it exists
           link: D,
           action: p,
-          getCellData: h,
+          getCellData: y,
           suffix: k,
           ...F
         };
-        console.log("Registering column:", N);
-        const G = e.body;
-        c(N, G);
+        console.log("Registering column:", M);
+        const K = e.body;
+        c(M, K);
       }
-    }), (r, o) => (s(), u("div", nt, [
-      pe(r.$slots, "body", { data: {} })
+    }), (l, n) => (o(), u("div", ot, [
+      V(l.$slots, "body", { data: {} })
     ]));
   }
-}), st = { class: "mt-4" }, it = { class: "text-sm text-gray-600 dark:text-gray-300" }, ut = /* @__PURE__ */ S({
+}), ut = { class: "mt-4" }, ct = { class: "text-sm text-gray-600 dark:text-gray-300" }, dt = /* @__PURE__ */ S({
   __name: "SelectionInfo",
   props: {
     selectedRows: {},
@@ -757,49 +776,49 @@ const Se = /* @__PURE__ */ S({
   },
   setup(b) {
     const a = b, e = f(() => a.selectedRows.length);
-    return (c, r) => (s(), u("div", st, [
-      d("div", it, " Обрано: " + y(e.value) + " з " + y(c.totalCount) + " записів ", 1)
+    return (c, l) => (o(), u("div", ut, [
+      d("div", ct, " Обрано: " + h(e.value) + " з " + h(c.totalCount) + " записів ", 1)
     ]));
   }
-}), ct = { class: "mt-4" }, dt = { class: "border-b border-gray-200 dark:border-gray-700" }, vt = { class: "-mb-px flex space-x-8" }, gt = ["onClick"], pt = { class: "mt-4" }, ft = { class: "bg-gray-900 rounded-lg overflow-hidden" }, mt = { class: "flex items-center justify-between px-4 py-2 bg-gray-800 border-b border-gray-700" }, bt = { class: "text-sm text-gray-300" }, ht = ["onClick"], yt = { class: "p-4 text-sm text-gray-100 overflow-x-auto" }, xt = /* @__PURE__ */ S({
+}), vt = { class: "mt-4" }, gt = { class: "border-b border-gray-200 dark:border-gray-700" }, pt = { class: "-mb-px flex space-x-8" }, ft = ["onClick"], mt = { class: "mt-4" }, bt = { class: "bg-gray-900 rounded-lg overflow-hidden" }, yt = { class: "flex items-center justify-between px-4 py-2 bg-gray-800 border-b border-gray-700" }, ht = { class: "text-sm text-gray-300" }, xt = ["onClick"], kt = { class: "p-4 text-sm text-gray-100 overflow-x-auto" }, _t = /* @__PURE__ */ S({
   __name: "CodeTabs",
   props: {
     tabs: {},
     defaultTab: { default: void 0 }
   },
   setup(b) {
-    const a = b, e = w(a.defaultTab || a.tabs[0]?.id || ""), c = async (r) => {
+    const a = b, e = w(a.defaultTab || a.tabs[0]?.id || ""), c = async (l) => {
       try {
-        await navigator.clipboard.writeText(r), console.log("Код скопійовано!");
-      } catch (o) {
-        console.error("Помилка копіювання:", o);
+        await navigator.clipboard.writeText(l), console.log("Код скопійовано!");
+      } catch (n) {
+        console.error("Помилка копіювання:", n);
       }
     };
-    return (r, o) => (s(), u("div", ct, [
-      d("div", dt, [
-        d("nav", vt, [
-          (s(!0), u(B, null, R(r.tabs, (i) => (s(), u("button", {
+    return (l, n) => (o(), u("div", vt, [
+      d("div", gt, [
+        d("nav", pt, [
+          (o(!0), u(B, null, z(l.tabs, (i) => (o(), u("button", {
             key: i.id,
             onClick: (_) => e.value = i.id,
             class: m([
               "py-2 px-1 border-b-2 font-medium text-sm transition-colors",
               e.value === i.id ? "border-blue-500 text-blue-600 dark:text-blue-400" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300"
             ])
-          }, y(i.label), 11, gt))), 128))
+          }, h(i.label), 11, ft))), 128))
         ])
       ]),
-      d("div", pt, [
-        (s(!0), u(B, null, R(r.tabs, (i) => Te((s(), u("div", {
+      d("div", mt, [
+        (o(!0), u(B, null, z(l.tabs, (i) => Fe((o(), u("div", {
           key: i.id
         }, [
-          d("div", ft, [
-            d("div", mt, [
-              d("span", bt, y(i.label), 1),
+          d("div", bt, [
+            d("div", yt, [
+              d("span", ht, h(i.label), 1),
               d("button", {
                 onClick: (_) => c(i.content),
                 class: "text-gray-400 hover:text-white transition-colors",
                 title: "Копіювати код"
-              }, o[0] || (o[0] = [
+              }, n[0] || (n[0] = [
                 d("svg", {
                   class: "w-4 h-4",
                   fill: "none",
@@ -813,35 +832,35 @@ const Se = /* @__PURE__ */ S({
                     d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
                   })
                 ], -1)
-              ]), 8, ht)
+              ]), 8, xt)
             ]),
-            d("pre", yt, [
-              d("code", null, y(i.content), 1)
+            d("pre", kt, [
+              d("code", null, h(i.content), 1)
             ])
           ])
         ])), [
-          [Fe, e.value === i.id]
+          [Se, e.value === i.id]
         ])), 128))
       ])
     ]));
   }
 });
-ce.install = function(a) {
-  a.component("DataTable", ce), a.component("Column", ot), a.component("Pagination", fe), a.component("SelectionInfo", ut), a.component("CodeTabs", xt);
+ve.install = function(a) {
+  a.component("DataTable", ve), a.component("Column", it), a.component("Pagination", me), a.component("SelectionInfo", dt), a.component("CodeTabs", _t);
 };
 export {
-  ze as ArrayFormat,
-  Be as BadgeFormat,
-  xt as CodeTabs,
-  ot as Column,
-  ce as DataTable,
-  De as DateFormat,
-  Le as LinkFormat,
-  Se as NumberFormat,
-  fe as Pagination,
-  Ne as SelectFormat,
-  ut as SelectionInfo,
-  Ae as TextFormat,
-  ce as default,
-  ue as formatComponents
+  Pe as ArrayFormat,
+  Re as BadgeFormat,
+  _t as CodeTabs,
+  it as Column,
+  ve as DataTable,
+  Ae as DateFormat,
+  Ne as LinkFormat,
+  De as NumberFormat,
+  me as Pagination,
+  Ve as SelectFormat,
+  dt as SelectionInfo,
+  Ie as TextFormat,
+  ve as default,
+  de as formatComponents
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.filter={},f.Vue))})(this,function(f,e){"use strict";const O=e.defineComponent({name:"NumberFormat",__name:"NumberFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>o.value===null||o.value===void 0?"":typeof o.value=="number"?o.value.toFixed(2):Intl.NumberFormat("uk-UA",{maximumFractionDigits:2}).format(Number(o.value)));return(c,l)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(t.value),1))}}),q=e.defineComponent({name:"DateFormat",__name:"DateFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>{if(!o.value)return"";try{return new Date(o.value).toLocaleDateString()}catch{return o.value}});return(c,l)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(t.value),1))}}),J=e.defineComponent({name:"TextFormat",__name:"TextFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,{value:t}=o,c=e.computed(()=>Array.isArray(t)?t.map(l=>l.text||l).join(","):t?.text||t);return(l,s)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(c.value),1))}}),G=((u,o)=>{const t=u.__vccOpts||u;for(const[c,l]of o)t[c]=l;return t})(e.defineComponent({name:"BadgeFormat",__name:"BadgeFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>{const s=String(o.value||"").toLowerCase(),i="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium";return s.includes("success")||s.includes("active")||s.includes("completed")?`${i} bg-green-100 text-green-800`:s.includes("error")||s.includes("failed")||s.includes("inactive")?`${i} bg-red-100 text-red-800`:s.includes("warning")||s.includes("pending")?`${i} bg-yellow-100 text-yellow-800`:s.includes("info")||s.includes("processing")?`${i} bg-blue-100 text-blue-800`:o.value?.color&&!/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(o.value.color)?`${i} bg-${o.value.color}-100 text-${o.value.color}-800`:`${i} bg-gray-100 text-gray-800`});function c(s,i=1){const h=parseInt(s.slice(1,3),16),x=parseInt(s.slice(3,5),16),C=parseInt(s.slice(5,7),16);return`rgba(${h}, ${x}, ${C}, ${i})`}const l=e.computed(()=>{const s={minWidth:"60px",textAlign:"center",display:"inline-block"};return/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(o.value?.color)?{...s,backgroundColor:c(o.value.color,.1),color:c(o.value.color,.8)}:s});return(s,i)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["badge",t.value]),style:e.normalizeStyle(l.value)},e.toDisplayString(s.value?.text||s.value),7))}}),[["__scopeId","data-v-28700c64"]]),ce={class:"flex flex-wrap gap-1"},K=e.defineComponent({name:"ArrayFormat",__name:"ArrayFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>o.value?Array.isArray(o.value)?o.value:[o.value]:[]),c=l=>l?typeof l=="object"&&l.name?l.name:typeof l=="string"||typeof l=="number"?String(l):JSON.stringify(l):"";return(l,s)=>(e.openBlock(),e.createElementBlock("div",ce,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,(i,h)=>(e.openBlock(),e.createElementBlock("span",{key:h,class:"inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800 hover:bg-blue-200 transition-colors"},e.toDisplayString(c(i)),1))),128))]))}}),de=["href","target"],Q=e.defineComponent({__name:"LinkFormat",props:{href:{default:""},target:{default:"_self"},onClick:{type:Function,default:void 0},value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>typeof o.value=="string"||typeof o.value=="number"?o.value:o.value?.text||o.value?.label||"Link"),c=e.computed(()=>o.href?o.href:typeof o.value=="object"&&o.value?.href?o.value.href:""),l=e.computed(()=>o.target?o.target:typeof o.value=="object"&&o.value?.target?o.value.target:"_self"),s=e.computed(()=>"text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 underline cursor-pointer"),i=h=>{o.onClick&&o.row&&(h.preventDefault(),o.onClick(o.row,o.value))};return(h,x)=>c.value?(e.openBlock(),e.createElementBlock("a",{key:0,href:c.value,target:l.value,class:e.normalizeClass(s.value),onClick:i},e.toDisplayString(t.value),11,de)):(e.openBlock(),e.createElementBlock("button",{key:1,type:"button",class:e.normalizeClass(s.value),onClick:i},e.toDisplayString(t.value),3))}}),X=e.defineComponent({name:"TextFormat",__name:"SelectFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,{value:t}=o,c=e.computed(()=>Array.isArray(t)?t.map(l=>l.text||l).filter((l,s)=>s<2).join(", ")+(t.length>2?` +${t.length-2}`:""):t?.text||t);return(l,s)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(c.value),1))}}),A={number:O,date:q,text:J,badge:G,array:K,select:X,link:Q},me={class:"flex items-center space-x-4"},pe={class:"font-medium"},ue={class:"font-medium"},ge={class:"font-medium"},fe={class:"flex items-center space-x-2"},ye=["disabled"],be={class:"flex items-center space-x-1"},he=["onClick"],ke=["disabled"],I=e.defineComponent({name:"Pagination",__name:"Pagination",props:{page:{},limit:{},total:{},theme:{default:"light"},size:{default:"medium"}},emits:["update:page"],setup(u,{emit:o}){const t=u,c=e.computed(()=>({small:{text:"text-xs",button:"px-2 h-7 text-xs min-w-[28px] flex items-center justify-center",icon:"w-3.5 h-3.5"},medium:{text:"text-sm",button:"px-3 h-9 text-sm min-w-[36px] flex items-center justify-center",icon:"w-4 h-4"},large:{text:"text-base",button:"px-4 h-11 text-base min-w-[44px] flex items-center justify-center",icon:"w-5 h-5"}})[t.size]),l=e.computed(()=>{const{theme:p}=t;return p==="dark"?{container:"bg-gray-900 border-gray-700",text:"text-gray-300",button:"text-gray-300 bg-gray-800 border-gray-600 hover:bg-gray-700",buttonDisabled:"text-gray-500 bg-gray-800",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-400"}:p==="light"?{container:"bg-white border-gray-200",text:"text-gray-700",button:"text-gray-700 bg-white border-gray-300 hover:bg-gray-50",buttonDisabled:"text-gray-400 bg-gray-100",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-500"}:{container:"bg-white dark:bg-gray-900 border-gray-200 dark:border-gray-700",text:"text-gray-700 dark:text-gray-300",button:"text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border-gray-300 dark:border-gray-600 hover:bg-gray-50 dark:hover:bg-gray-700",buttonDisabled:"text-gray-400 dark:text-gray-500 bg-gray-100 dark:bg-gray-800",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-500 dark:text-gray-400"}}),s=o,i=e.computed(()=>Math.ceil(t.total/t.limit)),h=e.computed(()=>t.total===0?0:(t.page-1)*t.limit+1),x=e.computed(()=>Math.min(t.page*t.limit,t.total)),C=e.computed(()=>{const p=[];if(i.value<=7)for(let b=1;b<=i.value;b+=1)p.push(b);else{p.push(1),t.page>4&&p.push("...");const b=Math.max(2,t.page-1),_=Math.min(i.value-1,t.page+1);for(let w=b;w<=_;w+=1)w!==1&&w!==i.value&&p.push(w);t.page<i.value-3&&p.push("..."),i.value>1&&p.push(i.value)}return p}),B=p=>{p>=1&&p<=i.value&&p!==t.page&&s("update:page",p)};return(p,g)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex items-center justify-between py-3 border-t",l.value.container])},[e.createElementVNode("div",me,[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center text-sm",l.value.text,c.value.text])},[e.createElementVNode("span",null,[g[2]||(g[2]=e.createTextVNode(" Показано ",-1)),e.createElementVNode("span",pe,e.toDisplayString(h.value),1),g[3]||(g[3]=e.createTextVNode(" до ",-1)),e.createElementVNode("span",ue,e.toDisplayString(x.value),1),g[4]||(g[4]=e.createTextVNode(" з ",-1)),e.createElementVNode("span",ge,e.toDisplayString(p.total),1),g[5]||(g[5]=e.createTextVNode(" результатів ",-1))])],2)]),e.createElementVNode("div",fe,[e.createElementVNode("button",{onClick:g[0]||(g[0]=b=>B(p.page-1)),disabled:p.page<=1,class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,p.page<=1?l.value.buttonDisabled:l.value.button])},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(c.value.icon),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},g[6]||(g[6]=[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M15 19l-7-7 7-7"},null,-1)]),2))],10,ye),e.createElementVNode("div",be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(C.value,b=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:b},[b==="..."?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["font-medium",c.value.button,l.value.ellipsis])}," ... ",2)):(e.openBlock(),e.createElementBlock("button",{key:1,onClick:_=>B(b),class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,b===p.page?l.value.buttonActive:l.value.button])},e.toDisplayString(b),11,he))],64))),128))]),e.createElementVNode("button",{onClick:g[1]||(g[1]=b=>B(p.page+1)),disabled:p.page>=i.value,class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,p.page>=i.value?l.value.buttonDisabled:l.value.button])},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(c.value.icon),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},g[7]||(g[7]=[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"},null,-1)]),2))],10,ke)])],2))}}),xe={key:0,class:"text-center py-8"},Ce={class:"inline-flex items-center space-x-2"},_e={key:2,class:"overflow-x-auto"},Be=["checked","indeterminate"],we=["onClick"],Ee={class:"flex items-center justify-between"},$e={key:0,class:"ml-1 text-xs"},Ne={key:1},Ve=["onClick"],Se=["checked","onChange"],De=["onClick"],$=e.defineComponent({name:"DataTable",__name:"DataTable",props:{rows:{default:()=>[]},columns:{default:()=>[]},api:{},router:{},tableStyle:{default:"min-width: 50rem"},tableClass:{default:"min-w-full divide-y divide-gray-200 dark:divide-gray-700"},tableClassWrapper:{},size:{default:"medium"},theme:{default:"light"},loading:{type:Boolean,default:!1},classTr:{default:""},classTd:{default:""},classTh:{default:""},classLink:{default:""},selectable:{type:Boolean,default:!1},selectedRows:{default:()=>[]},limit:{default:10},page:{default:1},total:{default:0},showPagination:{type:Boolean,default:!0},sortable:{type:Boolean,default:!1},clickable:{type:Boolean,default:!1},getCellData:{type:Function,default:void 0}},emits:["update:page","update:selectedRows","row-click","sort"],setup(u,{emit:o}){const t=u,c=o,l=e.ref(t.selectedRows||[]),s=e.ref([]),i=e.ref([]),h=e.ref([]),x=e.ref(!1),C=e.ref(null),B=e.ref(t.router),p=e.useSlots(),g=e.computed(()=>p.action);function b(a){if(B.value){B.value.push(a);return}location.href=a}const _=e.computed(()=>{if(t.api)return i.value;if(t.sortable&&s.value.length>0){const a=[...t.rows];return a.sort((d,n)=>{for(const m of s.value){if(!m.direction)return 0;const r=d[m.field],y=n[m.field];if(r==null)return 1;if(y==null)return-1;let E=0;typeof r=="string"&&typeof y=="string"?E=r.localeCompare(y):r<y?E=-1:r>y?E=1:E=0;const T=m.direction==="desc"?-E:E;if(T!==0)return T}return 0}),a}return t.rows});e.watch(()=>t.selectedRows,a=>{l.value=a||[]});const w=a=>l.value.some(d=>d===a),te=a=>{const d=l.value.findIndex(n=>n===a);d>-1?l.value.splice(d,1):l.value.push(a),c("update:selectedRows",[...l.value])},j=e.computed(()=>_.value.length>0&&l.value.length===_.value.length),N=e.computed(()=>l.value.length>0&&l.value.length<_.value.length),L=()=>{j.value?l.value=[]:l.value=[..._.value],c("update:selectedRows",[...l.value])},Ue=a=>{if(!t.sortable)return;const d=s.value.findIndex(m=>m.field===a);if(d>=0){const m=s.value[d];m.direction==="asc"?m.direction="desc":m.direction==="desc"&&s.value.splice(d,1)}else s.value.unshift({field:a,direction:"asc"});const n=s.value.filter(m=>m.direction).map(m=>({name:m.field,asc:m.direction==="asc"}));c("sort",n),t.api&&v()},Oe=a=>s.value.find(n=>n.field===a)?.direction==="asc",qe=a=>{const d=s.value.find(n=>n.field===a);if(!d)return"↑↓";switch(d.direction){case"asc":return"↑";case"desc":return"↓";default:return"↕️"}},R=a=>t.sortable&&a.sortable!==!1,Je=a=>{t.clickable&&c("row-click",a)},V=(a,d)=>{const n=d[a.name];if(t.getCellData||a.getCellData){const m=a.getCellData||t.getCellData;if(m){const r={name:a.name,row:d,value:n};return m(r)}}return["_data","_text"].map(m=>{const r=`${a.name}${m}`;return d[r]?d[r]:null}).find(m=>m)||n},ae=a=>a.width?a.width==="w-full"?"w-full":typeof a.width=="string"?a.width:typeof a.width=="number"?`w-${a.width}`:"":"",P=e.ref(t.page),oe=e.ref(t.limit),M=e.ref(t.total),S=e.ref(1),H=e.ref(10),D=e.ref(0),le=e.computed(()=>t.api?S.value:P.value),ne=e.computed(()=>t.api?H.value:oe.value),re=e.computed(()=>t.api?D.value:M.value),k=e.computed(()=>{const{theme:a}=t;return a==="dark"?{container:"dark",loading:"text-gray-400",error:"text-red-400",thead:"bg-gray-800",th:"text-gray-300",thHover:"hover:bg-gray-700",tbody:"bg-gray-900 divide-gray-700",tr:"hover:bg-gray-800",td:"text-gray-300",empty:"text-gray-400",checkbox:"border-gray-600 bg-gray-700 text-blue-400"}:a==="light"?{container:"",loading:"text-gray-500",error:"text-red-500",thead:"bg-gray-50",th:"text-gray-500",thHover:"hover:bg-gray-100",tbody:"bg-white divide-gray-200",tr:"hover:bg-gray-50",td:"text-gray-900",empty:"text-gray-500",checkbox:"border-gray-300 bg-white text-blue-600"}:{container:"",loading:"text-gray-500 dark:text-gray-400",error:"text-red-500 dark:text-red-400",thead:"bg-gray-50 dark:bg-gray-800",th:"text-gray-500 dark:text-gray-300",thHover:"hover:bg-gray-100 dark:hover:bg-gray-700",tbody:"bg-white dark:bg-gray-900 divide-gray-200 dark:divide-gray-700",tr:"hover:bg-gray-50 dark:hover:bg-gray-800",td:"text-gray-900 dark:text-gray-300",empty:"text-gray-500 dark:text-gray-400",checkbox:"border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400"}});e.watch(()=>t.page,a=>{P.value=a}),e.watch(()=>t.limit,a=>{oe.value=a}),e.watch(()=>t.total,a=>{M.value=a});async function v(){if(t.api){x.value=!0,C.value=null;try{const a=new URL(t.api,window.location.origin);if(a.searchParams.set("page",le.value.toString()),a.searchParams.set("limit",ne.value.toString()),s.value.length>0){const m=s.value.filter(r=>r.direction).map(r=>`${r.field}:${r.direction}`).join(",");m&&a.searchParams.set("sort",m)}const d=await fetch(a.toString());if(!d.ok)throw new Error(`HTTP error! status: ${d.status}`);const n=await d.json();n.rows&&Array.isArray(n.rows)&&(i.value=n.rows),n.columns&&Array.isArray(n.columns)&&(h.value=n.columns),n.total!==void 0&&(t.api?D.value=n.total:M.value=n.total)}catch(a){C.value=a instanceof Error?a.message:"Failed to fetch data",console.error("Error fetching data:",a)}finally{x.value=!1}}}const Ge=a=>{t.api?S.value=a:(P.value=a,c("update:page",a)),t.api&&v()},Ke=e.computed(()=>t.showPagination&&re.value>0),z=e.computed(()=>({small:{header:"px-3 py-2 text-xs",cell:"px-3 py-2 text-xs"},medium:{header:"px-6 py-3 text-xs",cell:"px-6 py-4 text-sm"},large:{header:"px-8 py-4 text-sm",cell:"px-8 py-6 text-base"}})[t.size]);e.onMounted(()=>{t.api&&(t.page&&(S.value=t.page),t.limit&&(H.value=t.limit),t.total&&(D.value=t.total),v())}),e.watch(()=>t.api,a=>{a&&(S.value=t.page||1,H.value=t.limit||10,D.value=t.total||0,v())});const Qe=e.computed(()=>t.api?h.value:t.columns),W=e.ref([]),F=e.ref({});e.provide("registerColumn",(a,d)=>{W.value.push(a),d&&a.slotName&&(F.value[a.name]=d)});const se=e.computed(()=>{const a=Qe.value||[],d=[],n=p.default?.();if(n){const m=n.filter(r=>r.type?.name==="Column"||r.type==="Column"||r.type&&typeof r.type=="object"&&r.type.name==="Column").map(r=>{const y=r.props||r.componentProps||{},E=y.field||y.name||"",T=y.header||y.label||"",ie=r.children&&r.children.body,U={name:E,ua:T,format:y.format||"text",slotName:ie?"body":void 0,...y};return ie&&U.name&&(F.value[U.name]=r.children.body),U});d.push(...m)}if(W.value.length>0&&d.push(...W.value),d.length>0){const m=[],r=new Set(d.map(y=>y.name));return a.forEach(y=>{r.has(y.name)||m.push(y)}),m.push(...d),console.log("Combined columns:",{default:a.length,custom:d.length,combined:m.length}),m}return a.length>0?(console.log("Using default columns:",a.length),a):[]}),Xe=(a="text")=>A[a]||A.text;return(a,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["w-full",k.value.container])},[x.value||t.loading?(e.openBlock(),e.createElementBlock("div",xe,[e.createElementVNode("div",Ce,[d[0]||(d[0]=e.createElementVNode("div",{class:"animate-spin rounded-full h-6 w-6 border-b-2 border-blue-600"},null,-1)),e.createElementVNode("span",{class:e.normalizeClass(k.value.loading)},"Loading...",2)])])):C.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["text-center py-8",k.value.error])},e.toDisplayString(C.value),3)):!t.loading&&_.value.length>0?(e.openBlock(),e.createElementBlock("div",_e,[e.createElementVNode("div",{class:e.normalizeClass(a.tableClassWrapper?a.tableClassWrapper:"relative w-full overflow-auto")},[e.createElementVNode("table",{class:e.normalizeClass(a.tableClass),style:e.normalizeStyle(a.tableStyle)},[e.createElementVNode("thead",{class:e.normalizeClass(k.value.thead)},[e.createElementVNode("tr",null,[a.selectable?(e.openBlock(),e.createElementBlock("th",{key:0,class:e.normalizeClass(["text-left font-medium uppercase tracking-wider",k.value.th,z.value.header,t.classTh,"w-12"])},[e.createElementVNode("input",{type:"checkbox",checked:j.value,indeterminate:N.value,onChange:L,class:e.normalizeClass(["h-4 w-4 focus:ring-blue-500 rounded",k.value.checkbox])},null,42,Be)],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(se.value.filter(n=>!n.hidden),n=>(e.openBlock(),e.createElementBlock("th",{key:n.name,class:e.normalizeClass(["text-left font-medium uppercase tracking-wider",k.value.th,z.value.header,t.classTh,n.align?`text-${n.align}`:"",R(n)?["cursor-pointer",k.value.thHover]:"",ae(n)]),onClick:m=>R(n)?Ue(n.name):void 0},[e.createElementVNode("div",Ee,[e.createElementVNode("span",null,e.toDisplayString(n.ua||n.header||n.name),1),R(n)?(e.openBlock(),e.createElementBlock("span",$e,[e.renderSlot(a.$slots,"sort",{asc:Oe(n.name)},()=>[e.createTextVNode(e.toDisplayString(qe(n.name)),1)])])):e.createCommentVNode("",!0)])],10,we))),128)),g.value?(e.openBlock(),e.createElementBlock("th",Ne,"Дії")):e.createCommentVNode("",!0)])],2),e.createElementVNode("tbody",{class:e.normalizeClass(k.value.tbody)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,(n,m)=>(e.openBlock(),e.createElementBlock("tr",{key:m,class:e.normalizeClass([k.value.tr,t.classTr,t.clickable?"cursor-pointer":""]),onClick:r=>t.clickable?Je(n):void 0},[a.selectable?(e.openBlock(),e.createElementBlock("td",{key:0,class:e.normalizeClass(["whitespace-nowrap",k.value.td,z.value.cell,t.classTd,"w-12"])},[e.createElementVNode("input",{type:"checkbox",checked:w(n),onChange:r=>te(n),class:e.normalizeClass(["h-4 w-4 focus:ring-blue-500 rounded",k.value.checkbox])},null,42,Se)],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(se.value.filter(r=>!r.hidden),r=>(e.openBlock(),e.createElementBlock("td",{key:r.name,class:e.normalizeClass(["whitespace-nowrap",k.value.td,z.value.cell,t.classTd,r.align?`text-${r.align}`:"",ae(r)])},[r.action&&g.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g.value),{key:0,row:n,value:V(r,n)},null,8,["row","value"])):r.slotName&&F.value[r.name]?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(F.value[r.name]),{key:1,data:n,value:V(r,n),row:n,column:r},null,8,["data","value","row","column"])):r.link?(e.openBlock(),e.createElementBlock("a",{key:2,class:e.normalizeClass(a.classLink||"hover:text-blue-900 cursor-pointer text-blue-700 hover:underline"),onClick:y=>b(r.link.replace("{id}",n.id))},e.toDisplayString(V(r,n)),11,De)):(e.openBlock(),e.createBlock(e.resolveDynamicComponent(Xe(r.format)),{key:3,value:V(r,n),row:n,column:r,href:r.link},null,8,["value","row","column","href"]))],2))),128)),e.createElementVNode("td",null,[g.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g.value),{key:0,row:n},null,8,["row"])):e.createCommentVNode("",!0)])],10,Ve))),128))],2)],6)],2)])):e.createCommentVNode("",!0),Ke.value&&!x.value&&!t.loading&&!C.value?(e.openBlock(),e.createBlock(I,{key:3,page:le.value,limit:ne.value,total:re.value,theme:t.theme,size:t.size,"onUpdate:page":Ge},null,8,["page","limit","total","theme","size"])):e.createCommentVNode("",!0),!x.value&&!t.loading&&!C.value&&_.value.length===0?(e.openBlock(),e.createElementBlock("div",{key:4,class:e.normalizeClass(["text-center py-8",k.value.empty])}," Дані відсутні ",2)):e.createCommentVNode("",!0)],2))}}),ve={style:{display:"none"}},Y=e.defineComponent({name:"Column",__name:"Column",props:{field:{},name:{},header:{},label:{},format:{},hidden:{type:Boolean},sortable:{type:Boolean},width:{},align:{},slot:{},slotName:{},link:{},action:{type:Boolean},getCellData:{type:Function},suffix:{}},setup(u){const o=u,t=e.useSlots(),c=e.inject("registerColumn");return e.onMounted(()=>{if(c){const{field:l,name:s,header:i,label:h,format:x,slotName:C,link:B,action:p,getCellData:g,suffix:b,..._}=o,N={name:l||s||"",ua:i||h||"",format:x||"text",slotName:C||(t.body?"body":void 0),link:B,action:p,getCellData:g,suffix:b,..._};console.log("Registering column:",N);const L=t.body;c(N,L)}}),(l,s)=>(e.openBlock(),e.createElementBlock("div",ve,[e.renderSlot(l.$slots,"body",{data:{}})]))}}),ze={class:"mt-4"},Fe={class:"text-sm text-gray-600 dark:text-gray-300"},Z=e.defineComponent({__name:"SelectionInfo",props:{selectedRows:{},totalCount:{}},setup(u){const o=u,t=e.computed(()=>o.selectedRows.length);return(c,l)=>(e.openBlock(),e.createElementBlock("div",ze,[e.createElementVNode("div",Fe," Обрано: "+e.toDisplayString(t.value)+" з "+e.toDisplayString(c.totalCount)+" записів ",1)]))}}),Te={class:"mt-4"},Ae={class:"border-b border-gray-200 dark:border-gray-700"},Ie={class:"-mb-px flex space-x-8"},je=["onClick"],Le={class:"mt-4"},Re={class:"bg-gray-900 rounded-lg overflow-hidden"},Pe={class:"flex items-center justify-between px-4 py-2 bg-gray-800 border-b border-gray-700"},Me={class:"text-sm text-gray-300"},He=["onClick"],We={class:"p-4 text-sm text-gray-100 overflow-x-auto"},ee=e.defineComponent({__name:"CodeTabs",props:{tabs:{},defaultTab:{default:void 0}},setup(u){const o=u,t=e.ref(o.defaultTab||o.tabs[0]?.id||""),c=async l=>{try{await navigator.clipboard.writeText(l),console.log("Код скопійовано!")}catch(s){console.error("Помилка копіювання:",s)}};return(l,s)=>(e.openBlock(),e.createElementBlock("div",Te,[e.createElementVNode("div",Ae,[e.createElementVNode("nav",Ie,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.tabs,i=>(e.openBlock(),e.createElementBlock("button",{key:i.id,onClick:h=>t.value=i.id,class:e.normalizeClass(["py-2 px-1 border-b-2 font-medium text-sm transition-colors",t.value===i.id?"border-blue-500 text-blue-600 dark:text-blue-400":"border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300"])},e.toDisplayString(i.label),11,je))),128))])]),e.createElementVNode("div",Le,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.tabs,i=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:i.id},[e.createElementVNode("div",Re,[e.createElementVNode("div",Pe,[e.createElementVNode("span",Me,e.toDisplayString(i.label),1),e.createElementVNode("button",{onClick:h=>c(i.content),class:"text-gray-400 hover:text-white transition-colors",title:"Копіювати код"},s[0]||(s[0]=[e.createElementVNode("svg",{class:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"})],-1)]),8,He)]),e.createElementVNode("pre",We,[e.createElementVNode("code",null,e.toDisplayString(i.content),1)])])])),[[e.vShow,t.value===i.id]])),128))])]))}});$.install=function(o){o.component("DataTable",$),o.component("Column",Y),o.component("Pagination",I),o.component("SelectionInfo",Z),o.component("CodeTabs",ee)},f.ArrayFormat=K,f.BadgeFormat=G,f.CodeTabs=ee,f.Column=Y,f.DataTable=$,f.DateFormat=q,f.LinkFormat=Q,f.NumberFormat=O,f.Pagination=I,f.SelectFormat=X,f.SelectionInfo=Z,f.TextFormat=J,f.default=$,f.formatComponents=A,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.filter={},f.Vue))})(this,function(f,e){"use strict";const O=e.defineComponent({name:"NumberFormat",__name:"NumberFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>o.value===null||o.value===void 0?"":typeof o.value=="number"?o.value.toFixed(2):Intl.NumberFormat("uk-UA",{maximumFractionDigits:2}).format(Number(o.value)));return(c,n)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(t.value),1))}}),q=e.defineComponent({name:"DateFormat",__name:"DateFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>{if(!o.value)return"";try{return new Date(o.value).toLocaleDateString()}catch{return o.value}});return(c,n)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(t.value),1))}}),J=e.defineComponent({name:"TextFormat",__name:"TextFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,{value:t}=o,c=e.computed(()=>Array.isArray(t)?t.map(n=>n.text||n).join(","):t?.text||t);return(n,s)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(c.value),1))}}),G=((u,o)=>{const t=u.__vccOpts||u;for(const[c,n]of o)t[c]=n;return t})(e.defineComponent({name:"BadgeFormat",__name:"BadgeFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>{const s=String(o.value||"").toLowerCase(),i="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium";return s.includes("success")||s.includes("active")||s.includes("completed")?`${i} bg-green-100 text-green-800`:s.includes("error")||s.includes("failed")||s.includes("inactive")?`${i} bg-red-100 text-red-800`:s.includes("warning")||s.includes("pending")?`${i} bg-yellow-100 text-yellow-800`:s.includes("info")||s.includes("processing")?`${i} bg-blue-100 text-blue-800`:o.value?.color&&!/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(o.value.color)?`${i} bg-${o.value.color}-100 text-${o.value.color}-800`:`${i} bg-gray-100 text-gray-800`});function c(s,i=1){const h=parseInt(s.slice(1,3),16),x=parseInt(s.slice(3,5),16),C=parseInt(s.slice(5,7),16);return`rgba(${h}, ${x}, ${C}, ${i})`}const n=e.computed(()=>{const s={minWidth:"60px",textAlign:"center",display:"inline-block"};return/^#([0-9a-f]{3}|[0-9a-f]{6})$/i.test(o.value?.color)?{...s,backgroundColor:c(o.value.color,.1),color:c(o.value.color,.8)}:s});return(s,i)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["badge",t.value]),style:e.normalizeStyle(n.value)},e.toDisplayString(s.value?.text||s.value),7))}}),[["__scopeId","data-v-28700c64"]]),ce={class:"flex flex-wrap gap-1"},K=e.defineComponent({name:"ArrayFormat",__name:"ArrayFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>o.value?Array.isArray(o.value)?o.value:[o.value]:[]),c=n=>n?typeof n=="object"&&n.name?n.name:typeof n=="string"||typeof n=="number"?String(n):JSON.stringify(n):"";return(n,s)=>(e.openBlock(),e.createElementBlock("div",ce,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,(i,h)=>(e.openBlock(),e.createElementBlock("span",{key:h,class:"inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800 hover:bg-blue-200 transition-colors"},e.toDisplayString(c(i)),1))),128))]))}}),de=["href","target"],Q=e.defineComponent({__name:"LinkFormat",props:{href:{default:""},target:{default:"_self"},onClick:{type:Function,default:void 0},value:{},row:{},column:{}},setup(u){const o=u,t=e.computed(()=>typeof o.value=="string"||typeof o.value=="number"?o.value:o.value?.text||o.value?.label||"Link"),c=e.computed(()=>o.href?o.href:typeof o.value=="object"&&o.value?.href?o.value.href:""),n=e.computed(()=>o.target?o.target:typeof o.value=="object"&&o.value?.target?o.value.target:"_self"),s=e.computed(()=>"text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 underline cursor-pointer"),i=h=>{o.onClick&&o.row&&(h.preventDefault(),o.onClick(o.row,o.value))};return(h,x)=>c.value?(e.openBlock(),e.createElementBlock("a",{key:0,href:c.value,target:n.value,class:e.normalizeClass(s.value),onClick:i},e.toDisplayString(t.value),11,de)):(e.openBlock(),e.createElementBlock("button",{key:1,type:"button",class:e.normalizeClass(s.value),onClick:i},e.toDisplayString(t.value),3))}}),X=e.defineComponent({name:"TextFormat",__name:"SelectFormat",props:{value:{},row:{},column:{}},setup(u){const o=u,{value:t}=o,c=e.computed(()=>Array.isArray(t)?t.map(n=>n.text||n).filter((n,s)=>s<2).join(", ")+(t.length>2?` +${t.length-2}`:""):t?.text||t);return(n,s)=>(e.openBlock(),e.createElementBlock("span",null,e.toDisplayString(c.value),1))}}),A={number:O,date:q,text:J,badge:G,array:K,select:X,link:Q},me={class:"flex items-center space-x-4"},pe={class:"font-medium"},ue={class:"font-medium"},ge={class:"font-medium"},fe={class:"flex items-center space-x-2"},ye=["disabled"],be={class:"flex items-center space-x-1"},he=["onClick"],ke=["disabled"],I=e.defineComponent({name:"Pagination",__name:"Pagination",props:{page:{},limit:{},total:{},theme:{default:"light"},size:{default:"medium"}},emits:["update:page"],setup(u,{emit:o}){const t=u,c=e.computed(()=>({small:{text:"text-xs",button:"px-2 h-7 text-xs min-w-[28px] flex items-center justify-center",icon:"w-3.5 h-3.5"},medium:{text:"text-sm",button:"px-3 h-9 text-sm min-w-[36px] flex items-center justify-center",icon:"w-4 h-4"},large:{text:"text-base",button:"px-4 h-11 text-base min-w-[44px] flex items-center justify-center",icon:"w-5 h-5"}})[t.size]),n=e.computed(()=>{const{theme:p}=t;return p==="dark"?{container:"bg-gray-900 border-gray-700",text:"text-gray-300",button:"text-gray-300 bg-gray-800 border-gray-600 hover:bg-gray-700",buttonDisabled:"text-gray-500 bg-gray-800",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-400"}:p==="light"?{container:"bg-white border-gray-200",text:"text-gray-700",button:"text-gray-700 bg-white border-gray-300 hover:bg-gray-50",buttonDisabled:"text-gray-400 bg-gray-100",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-500"}:{container:"bg-white dark:bg-gray-900 border-gray-200 dark:border-gray-700",text:"text-gray-700 dark:text-gray-300",button:"text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border-gray-300 dark:border-gray-600 hover:bg-gray-50 dark:hover:bg-gray-700",buttonDisabled:"text-gray-400 dark:text-gray-500 bg-gray-100 dark:bg-gray-800",buttonActive:"bg-blue-600 text-white",ellipsis:"text-gray-500 dark:text-gray-400"}}),s=o,i=e.computed(()=>Math.ceil(t.total/t.limit)),h=e.computed(()=>t.total===0?0:(t.page-1)*t.limit+1),x=e.computed(()=>Math.min(t.page*t.limit,t.total)),C=e.computed(()=>{const p=[];if(i.value<=7)for(let b=1;b<=i.value;b+=1)p.push(b);else{p.push(1),t.page>4&&p.push("...");const b=Math.max(2,t.page-1),_=Math.min(i.value-1,t.page+1);for(let w=b;w<=_;w+=1)w!==1&&w!==i.value&&p.push(w);t.page<i.value-3&&p.push("..."),i.value>1&&p.push(i.value)}return p}),B=p=>{p>=1&&p<=i.value&&p!==t.page&&s("update:page",p)};return(p,g)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex items-center justify-between py-3 border-t",n.value.container])},[e.createElementVNode("div",me,[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center text-sm",n.value.text,c.value.text])},[e.createElementVNode("span",null,[g[2]||(g[2]=e.createTextVNode(" Показано ",-1)),e.createElementVNode("span",pe,e.toDisplayString(h.value),1),g[3]||(g[3]=e.createTextVNode(" до ",-1)),e.createElementVNode("span",ue,e.toDisplayString(x.value),1),g[4]||(g[4]=e.createTextVNode(" з ",-1)),e.createElementVNode("span",ge,e.toDisplayString(p.total),1),g[5]||(g[5]=e.createTextVNode(" результатів ",-1))])],2)]),e.createElementVNode("div",fe,[e.createElementVNode("button",{onClick:g[0]||(g[0]=b=>B(p.page-1)),disabled:p.page<=1,class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,p.page<=1?n.value.buttonDisabled:n.value.button])},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(c.value.icon),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},g[6]||(g[6]=[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M15 19l-7-7 7-7"},null,-1)]),2))],10,ye),e.createElementVNode("div",be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(C.value,b=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:b},[b==="..."?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["font-medium",c.value.button,n.value.ellipsis])}," ... ",2)):(e.openBlock(),e.createElementBlock("button",{key:1,onClick:_=>B(b),class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,b===p.page?n.value.buttonActive:n.value.button])},e.toDisplayString(b),11,he))],64))),128))]),e.createElementVNode("button",{onClick:g[1]||(g[1]=b=>B(p.page+1)),disabled:p.page>=i.value,class:e.normalizeClass(["relative font-medium rounded-md",c.value.button,p.page>=i.value?n.value.buttonDisabled:n.value.button])},[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(c.value.icon),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},g[7]||(g[7]=[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"},null,-1)]),2))],10,ke)])],2))}}),xe={key:0,class:"text-center py-8"},Ce={class:"inline-flex items-center space-x-2"},_e={key:2,class:"overflow-x-auto"},Be=["checked","indeterminate"],we=["onClick"],Ee={class:"flex items-center justify-between"},$e={key:0,class:"ml-1 text-xs"},Ne={key:1,class:"w-[100px]"},Ve=["onClick"],Se=["checked","onChange"],De=["onClick"],Te={key:1,class:"text-center"},N=e.defineComponent({name:"DataTable",__name:"DataTable",props:{rows:{default:()=>[]},columns:{default:()=>[]},api:{},router:{},tableStyle:{default:""},size:{default:"medium"},theme:{default:"light"},loading:{type:Boolean,default:!1},classWrapper:{default:""},classTable:{default:"min-w-full divide-y divide-gray-200 dark:divide-gray-700"},classTbody:{default:""},classTr:{default:""},classTd:{default:""},classTh:{default:""},classThead:{default:""},classLink:{default:""},selectable:{type:Boolean,default:!1},selectedRows:{default:()=>[]},limit:{default:10},page:{default:1},total:{default:0},showPagination:{type:Boolean,default:!0},sortable:{type:Boolean,default:!1},clickable:{type:Boolean,default:!1},getCellData:{type:Function,default:void 0}},emits:["update:page","update:selectedRows","row-click","sort"],setup(u,{emit:o}){const t=u,c=o,n=e.ref(t.selectedRows||[]),s=e.ref([]),i=e.ref([]),h=e.ref([]),x=e.ref(!1),C=e.ref(null),B=e.ref(t.router),p=e.useSlots(),g=e.computed(()=>p.action);function b(a){if(B.value){B.value.push(a);return}location.href=a}const _=e.computed(()=>{if(t.api)return i.value;if(t.sortable&&s.value.length>0){const a=[...t.rows];return a.sort((d,l)=>{for(const m of s.value){if(!m.direction)return 0;const r=d[m.field],y=l[m.field];if(r==null)return 1;if(y==null)return-1;let E=0;typeof r=="string"&&typeof y=="string"?E=r.localeCompare(y):r<y?E=-1:r>y?E=1:E=0;const F=m.direction==="desc"?-E:E;if(F!==0)return F}return 0}),a}return t.rows});e.watch(()=>t.selectedRows,a=>{n.value=a||[]});const w=a=>n.value.some(d=>d===a),te=a=>{const d=n.value.findIndex(l=>l===a);d>-1?n.value.splice(d,1):n.value.push(a),c("update:selectedRows",[...n.value])},L=e.computed(()=>_.value.length>0&&n.value.length===_.value.length),V=e.computed(()=>n.value.length>0&&n.value.length<_.value.length),j=()=>{L.value?n.value=[]:n.value=[..._.value],c("update:selectedRows",[...n.value])},Oe=a=>{if(!t.sortable)return;const d=s.value.findIndex(m=>m.field===a);if(d>=0){const m=s.value[d];m.direction==="asc"?m.direction="desc":m.direction==="desc"&&s.value.splice(d,1)}else s.value.unshift({field:a,direction:"asc"});const l=s.value.filter(m=>m.direction).map(m=>({name:m.field,asc:m.direction==="asc"}));c("sort",l),t.api&&T()},qe=a=>s.value.find(l=>l.field===a)?.direction==="asc",Je=a=>{const d=s.value.find(l=>l.field===a);if(!d)return"↑↓";switch(d.direction){case"asc":return"↑";case"desc":return"↓";default:return"↕️"}},R=a=>t.sortable&&a.sortable!==!1,Ge=a=>{t.clickable&&c("row-click",a)},$=(a,d)=>{const l=d[a.name];if(t.getCellData||a.getCellData){const m=a.getCellData||t.getCellData;if(m){const r={name:a.name,row:d,value:l};return m(r)}}return["_data","_text"].map(m=>{const r=`${a.name}${m}`;return d[r]?d[r]:null}).find(m=>m)||l},ae=a=>a.width?a.width==="w-full"?"w-full":typeof a.width=="string"?`w-[${a.width}px]`:typeof a.width=="number"?`w-[${a.width}px]`:"":"",P=e.ref(t.page),oe=e.ref(t.limit),M=e.ref(t.total),S=e.ref(1),H=e.ref(10),D=e.ref(0),le=e.computed(()=>t.api?S.value:P.value),ne=e.computed(()=>t.api?H.value:oe.value),re=e.computed(()=>t.api?D.value:M.value),k=e.computed(()=>{const{theme:a}=t;return a==="dark"?{container:"dark",loading:"text-gray-400",error:"text-red-400",thead:"bg-gray-800",th:"text-gray-300",thHover:"hover:bg-gray-700",tbody:"bg-gray-900 divide-gray-700",tr:"hover:bg-gray-800",td:"text-gray-300",empty:"text-gray-400",checkbox:"border-gray-600 bg-gray-700 text-blue-400"}:a==="light"?{container:"",loading:"text-gray-500",error:"text-red-500",thead:"bg-gray-50",th:"text-gray-500",thHover:"hover:bg-gray-100",tbody:"bg-white divide-gray-200",tr:"hover:bg-gray-50",td:"text-gray-900",empty:"text-gray-500",checkbox:"border-gray-300 bg-white text-blue-600"}:{container:"",loading:"text-gray-500 dark:text-gray-400",error:"text-red-500 dark:text-red-400",thead:"bg-gray-50 dark:bg-gray-800",th:"text-gray-500 dark:text-gray-300",thHover:"hover:bg-gray-100 dark:hover:bg-gray-700",tbody:"bg-white dark:bg-gray-900 divide-gray-200 dark:divide-gray-700",tr:"hover:bg-gray-50 dark:hover:bg-gray-800",td:"text-gray-900 dark:text-gray-300",empty:"text-gray-500 dark:text-gray-400",checkbox:"border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400"}});e.watch(()=>t.page,a=>{P.value=a}),e.watch(()=>t.limit,a=>{oe.value=a}),e.watch(()=>t.total,a=>{M.value=a});async function T(){if(t.api){x.value=!0,C.value=null;try{const a=new URL(t.api,window.location.origin);if(a.searchParams.set("page",le.value.toString()),a.searchParams.set("limit",ne.value.toString()),s.value.length>0){const m=s.value.filter(r=>r.direction).map(r=>`${r.field}:${r.direction}`).join(",");m&&a.searchParams.set("sort",m)}const d=await fetch(a.toString());if(!d.ok)throw new Error(`HTTP error! status: ${d.status}`);const l=await d.json();l.rows&&Array.isArray(l.rows)&&(i.value=l.rows),l.columns&&Array.isArray(l.columns)&&(h.value=l.columns),l.total!==void 0&&(t.api?D.value=l.total:M.value=l.total)}catch(a){C.value=a instanceof Error?a.message:"Failed to fetch data",console.error("Error fetching data:",a)}finally{x.value=!1}}}const Ke=a=>{t.api?S.value=a:(P.value=a,c("update:page",a)),t.api&&T()},Qe=e.computed(()=>t.showPagination&&re.value>0),z=e.computed(()=>({small:{header:"px-3 py-2 text-xs",cell:"px-3 py-2 text-xs"},medium:{header:"px-6 py-3 text-xs",cell:"px-6 py-4 text-sm"},large:{header:"px-8 py-4 text-sm",cell:"px-8 py-6 text-base"}})[t.size]);e.onMounted(()=>{t.api&&(t.page&&(S.value=t.page),t.limit&&(H.value=t.limit),t.total&&(D.value=t.total),T())}),e.watch(()=>t.api,a=>{a&&(S.value=t.page||1,H.value=t.limit||10,D.value=t.total||0,T())});const Xe=e.computed(()=>t.api?h.value:t.columns),W=e.ref([]),v=e.ref({});e.provide("registerColumn",(a,d)=>{W.value.push(a),d&&a.slotName&&(v.value[a.name]=d)});const se=e.computed(()=>{const a=Xe.value||[],d=[],l=p.default?.();if(l){const m=l.filter(r=>r.type?.name==="Column"||r.type==="Column"||r.type&&typeof r.type=="object"&&r.type.name==="Column").map(r=>{const y=r.props||r.componentProps||{},E=y.field||y.name||"",F=y.header||y.label||"",ie=r.children&&r.children.body,U={name:E,ua:F,format:y.format||"text",slotName:ie?"body":void 0,...y};return ie&&U.name&&(v.value[U.name]=r.children.body),U});d.push(...m)}if(W.value.length>0&&d.push(...W.value),d.length>0){const m=[],r=new Set(d.map(y=>y.name));return a.forEach(y=>{r.has(y.name)||m.push(y)}),m.push(...d),console.log("Combined columns:",{default:a.length,custom:d.length,combined:m.length}),m}return a.length>0?(console.log("Using default columns:",a.length),a):[]}),Ye=(a="text")=>A[a.toLowerCase()]||A.text;return(a,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["w-full",k.value.container])},[x.value||t.loading?(e.openBlock(),e.createElementBlock("div",xe,[e.createElementVNode("div",Ce,[d[0]||(d[0]=e.createElementVNode("div",{class:"animate-spin rounded-full h-6 w-6 border-b-2 border-blue-600"},null,-1)),e.createElementVNode("span",{class:e.normalizeClass(k.value.loading)},"Loading...",2)])])):C.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["text-center py-8",k.value.error])},e.toDisplayString(C.value),3)):!t.loading&&_.value.length>0?(e.openBlock(),e.createElementBlock("div",_e,[e.createElementVNode("div",{class:e.normalizeClass(a.classWrapper?a.classWrapper:"relative w-full overflow-auto")},[e.createElementVNode("table",{class:e.normalizeClass(a.classTable),style:e.normalizeStyle(a.tableStyle)},[e.createElementVNode("thead",{class:e.normalizeClass(a.classThead||k.value.thead)},[e.createElementVNode("tr",null,[a.selectable?(e.openBlock(),e.createElementBlock("th",{key:0,class:e.normalizeClass(["text-left font-medium uppercase tracking-wider",k.value.th,z.value.header,t.classTh,"w-12"])},[e.createElementVNode("input",{type:"checkbox",checked:L.value,indeterminate:V.value,onChange:j,class:e.normalizeClass(["h-4 w-4 focus:ring-blue-500 rounded",k.value.checkbox])},null,42,Be)],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(se.value.filter(l=>!l.hidden),l=>(e.openBlock(),e.createElementBlock("th",{key:l.name,class:e.normalizeClass([l.align?`text-${l.align}`:"",R(l)?["cursor-pointer",k.value.thHover]:"",ae(l)].concat(t.classTh||["text-left font-medium uppercase tracking-wider",k.value.th,z.value.header])),onClick:m=>R(l)?Oe(l.name):void 0},[e.createElementVNode("div",Ee,[e.createElementVNode("span",null,e.toDisplayString(l.ua||l.header||l.name),1),R(l)?(e.openBlock(),e.createElementBlock("span",$e,[e.renderSlot(a.$slots,"sort",{asc:qe(l.name)},()=>[e.createTextVNode(e.toDisplayString(Je(l.name)),1)])])):e.createCommentVNode("",!0)])],10,we))),128)),g.value?(e.openBlock(),e.createElementBlock("th",Ne,"Дії")):e.createCommentVNode("",!0)])],2),e.createElementVNode("tbody",{class:e.normalizeClass(a.classTbody||k.value.tbody)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,(l,m)=>(e.openBlock(),e.createElementBlock("tr",{key:m,class:e.normalizeClass(t.classTr||[k.value.tr,t.clickable?"cursor-pointer":""]),onClick:r=>t.clickable?Ge(l):void 0},[a.selectable?(e.openBlock(),e.createElementBlock("td",{key:0,class:e.normalizeClass(["whitespace-nowrap",k.value.td,z.value.cell,t.classTd,"w-12"])},[e.createElementVNode("input",{type:"checkbox",checked:w(l),onChange:r=>te(l),class:e.normalizeClass(["h-4 w-4 focus:ring-blue-500 rounded",k.value.checkbox])},null,42,Se)],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(se.value.filter(r=>!r.hidden),r=>(e.openBlock(),e.createElementBlock("td",{key:r.name,class:e.normalizeClass(t.classTd||["whitespace-nowrap",k.value.td,z.value.cell,r.align?`text-${r.align}`:"",ae(r)])},[r.action&&g.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g.value),{key:0,row:l,value:$(r,l)},null,8,["row","value"])):e.unref(p).number&&r.format==="number"?e.renderSlot(a.$slots,"number",{key:1,row:l,value:$(r,l)}):e.unref(p).badge&&r.format==="badge"?e.renderSlot(a.$slots,"badge",{key:2,row:l,value:$(r,l)}):e.unref(p).array&&r.format==="array"?e.renderSlot(a.$slots,"array",{key:3,row:l,value:$(r,l)}):r.slotName&&v.value[r.name]?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(v.value[r.name]),{key:4,data:l,value:$(r,l),row:l,column:r},null,8,["data","value","row","column"])):r.link?(e.openBlock(),e.createElementBlock("a",{key:5,class:e.normalizeClass(a.classLink||"hover:text-blue-900 cursor-pointer text-blue-700 hover:underline"),onClick:y=>b(r.link.replace("{id}",l.id))},e.toDisplayString($(r,l)),11,De)):(e.openBlock(),e.createBlock(e.resolveDynamicComponent(Ye(r.format)),{key:6,value:$(r,l),row:l,column:r,href:r.link},null,8,["value","row","column","href"]))],2))),128)),g.value?(e.openBlock(),e.createElementBlock("td",Te,[e.createElementVNode("template",null,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g.value),{row:l},null,8,["row"]))])])):e.createCommentVNode("",!0)],10,Ve))),128))],2)],6)],2)])):e.createCommentVNode("",!0),Qe.value&&!x.value&&!t.loading&&!C.value?(e.openBlock(),e.createBlock(I,{key:3,page:le.value,limit:ne.value,total:re.value,theme:t.theme,size:t.size,"onUpdate:page":Ke},null,8,["page","limit","total","theme","size"])):e.createCommentVNode("",!0),!x.value&&!t.loading&&!C.value&&_.value.length===0?(e.openBlock(),e.createElementBlock("div",{key:4,class:e.normalizeClass(["text-center py-8",k.value.empty])}," Дані відсутні ",2)):e.createCommentVNode("",!0)],2))}}),ze={style:{display:"none"}},Y=e.defineComponent({name:"Column",__name:"Column",props:{field:{},name:{},header:{},label:{},format:{},hidden:{type:Boolean},sortable:{type:Boolean},width:{},align:{},slot:{},slotName:{},link:{},action:{type:Boolean},getCellData:{type:Function},suffix:{}},setup(u){const o=u,t=e.useSlots(),c=e.inject("registerColumn");return e.onMounted(()=>{if(c){const{field:n,name:s,header:i,label:h,format:x,slotName:C,link:B,action:p,getCellData:g,suffix:b,..._}=o,V={name:n||s||"",ua:i||h||"",format:x||"text",slotName:C||(t.body?"body":void 0),link:B,action:p,getCellData:g,suffix:b,..._};console.log("Registering column:",V);const j=t.body;c(V,j)}}),(n,s)=>(e.openBlock(),e.createElementBlock("div",ze,[e.renderSlot(n.$slots,"body",{data:{}})]))}}),ve={class:"mt-4"},Fe={class:"text-sm text-gray-600 dark:text-gray-300"},Z=e.defineComponent({__name:"SelectionInfo",props:{selectedRows:{},totalCount:{}},setup(u){const o=u,t=e.computed(()=>o.selectedRows.length);return(c,n)=>(e.openBlock(),e.createElementBlock("div",ve,[e.createElementVNode("div",Fe," Обрано: "+e.toDisplayString(t.value)+" з "+e.toDisplayString(c.totalCount)+" записів ",1)]))}}),Ae={class:"mt-4"},Ie={class:"border-b border-gray-200 dark:border-gray-700"},Le={class:"-mb-px flex space-x-8"},je=["onClick"],Re={class:"mt-4"},Pe={class:"bg-gray-900 rounded-lg overflow-hidden"},Me={class:"flex items-center justify-between px-4 py-2 bg-gray-800 border-b border-gray-700"},He={class:"text-sm text-gray-300"},We=["onClick"],Ue={class:"p-4 text-sm text-gray-100 overflow-x-auto"},ee=e.defineComponent({__name:"CodeTabs",props:{tabs:{},defaultTab:{default:void 0}},setup(u){const o=u,t=e.ref(o.defaultTab||o.tabs[0]?.id||""),c=async n=>{try{await navigator.clipboard.writeText(n),console.log("Код скопійовано!")}catch(s){console.error("Помилка копіювання:",s)}};return(n,s)=>(e.openBlock(),e.createElementBlock("div",Ae,[e.createElementVNode("div",Ie,[e.createElementVNode("nav",Le,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.tabs,i=>(e.openBlock(),e.createElementBlock("button",{key:i.id,onClick:h=>t.value=i.id,class:e.normalizeClass(["py-2 px-1 border-b-2 font-medium text-sm transition-colors",t.value===i.id?"border-blue-500 text-blue-600 dark:text-blue-400":"border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300"])},e.toDisplayString(i.label),11,je))),128))])]),e.createElementVNode("div",Re,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.tabs,i=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:i.id},[e.createElementVNode("div",Pe,[e.createElementVNode("div",Me,[e.createElementVNode("span",He,e.toDisplayString(i.label),1),e.createElementVNode("button",{onClick:h=>c(i.content),class:"text-gray-400 hover:text-white transition-colors",title:"Копіювати код"},s[0]||(s[0]=[e.createElementVNode("svg",{class:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"})],-1)]),8,We)]),e.createElementVNode("pre",Ue,[e.createElementVNode("code",null,e.toDisplayString(i.content),1)])])])),[[e.vShow,t.value===i.id]])),128))])]))}});N.install=function(o){o.component("DataTable",N),o.component("Column",Y),o.component("Pagination",I),o.component("SelectionInfo",Z),o.component("CodeTabs",ee)},f.ArrayFormat=K,f.BadgeFormat=G,f.CodeTabs=ee,f.Column=Y,f.DataTable=N,f.DateFormat=q,f.LinkFormat=Q,f.NumberFormat=O,f.Pagination=I,f.SelectFormat=X,f.SelectionInfo=Z,f.TextFormat=J,f.default=N,f.formatComponents=A,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengis/table",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "description": "A Vue 3 data table component with advanced features",
   "main": "dist/index.mjs",
   "files": [