@konstructio/ui 0.1.2-alpha.77 → 0.1.2-alpha.79

package/dist/components/VirtualizedTable/components/Body/Body.js

@@ -1,61 +1,53 @@
-import { jsx as a, jsxs as A } from "react/jsx-runtime";
-import { f as B } from "../../../../index-CSWGJT-v.js";
-import { Fragment as H } from "react";
-import { Skeleton as M } from "../Skeleton/Skeleton.js";
-import { cn as l } from "../../../../utils/index.js";
-import { ExpandableRow as O } from "../ExpandableRow/ExpandableRow.js";
-import { useTableContext as V } from "../../contexts/table.hook.js";
-const U = ({
-  isLoading: g,
-  showPagination: t
-}) => {
-  const {
-    table: i,
-    pageSize: h,
-    tableFetching: w,
-    enableExpandedRow: N,
-    classNameExpandedRow: R,
-    classNameExpandedCell: k,
-    classNameExpandedContent: E,
-    enableHoverRow: p,
-    classNameHoverRow: C,
-    classNameActiveExpandedRow: v,
-    renderExpandedRow: b,
-    isBorderOnAdjacentCell: D,
-    isExpandColumnVisible: y
-  } = V();
-  if (g || w)
-    return /* @__PURE__ */ a(M, { numberOfRows: h, table: i });
+import { t as l } from "../../../../utils-DHuiYnx1.js";
+import { n as A } from "../../../../table.provider-4OQNqxH3.js";
+import { useTableContext as B } from "../../contexts/table.hook.js";
+import { Skeleton as H } from "../Skeleton/Skeleton.js";
+import { ExpandableRow as M } from "../ExpandableRow/ExpandableRow.js";
+import { Fragment as O } from "react";
+import { jsx as a, jsxs as V } from "react/jsx-runtime";
+var U = ({ isLoading: g, showPagination: t }) => {
+  const { table: i, pageSize: h, tableFetching: w, enableExpandedRow: N, classNameExpandedRow: R, classNameExpandedCell: k, classNameExpandedContent: E, enableHoverRow: p, classNameHoverRow: v, classNameActiveExpandedRow: C, renderExpandedRow: b, isBorderOnAdjacentCell: D, isExpandColumnVisible: y } = B();
+  if (g || w) return /* @__PURE__ */ a(H, {
+    numberOfRows: h,
+    table: i
+  });
   const d = i.getRowModel().rows ?? [];
-  return /* @__PURE__ */ a("tbody", { className: l("text-slate-800", "text-sm", "font-normal", "relative", "dark:border-x"), children: d.map((x, s) => {
-    const {
-      id: m,
-      original: c,
-      getVisibleCells: j
-    } = x, {
-      meta: o = {}
-    } = c, n = j(), e = N && x.getIsExpanded(), z = !!o.expandedRow || !!b, u = n[0]?.column.id !== "__expand" || y ? 0 : D ? 1 : null;
-    return /* @__PURE__ */ A(H, { children: [
-      /* @__PURE__ */ a("tr", { className: l({
-        "group/row": p
-      }, "border-b", "border-b-gray-200", "dark:text-metal-50", "dark:border-b-metal-700", "bg-transparent", o.className), "data-row-id": m, ...o.attributes ?? {}, children: n.map(({
-        id: F,
-        column: r,
-        getContext: S
-      }, f) => {
-        const _ = typeof r.columnDef.meta?.className == "function" ? r.columnDef.meta?.className(c) : r.columnDef.meta?.className;
-        return /* @__PURE__ */ a("td", { className: l("px-4", "py-1", "text-sm", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", {
-          "group-hover/row:bg-zinc-100 dark:group-hover/row:bg-metal-800": p,
-          [l("bg-zinc-100 dark:bg-metal-800", v)]: !!e
-        }, C, _, {
-          "rounded-bl-lg": s === d.length - 1 && u !== null && f === u && !t && !e,
-          "rounded-br-lg": s === d.length - 1 && f === n.length - 1 && !t && !e,
-          "dark:[tr:last-child_&]:border-b": !t
-        }), "data-expanded": e ? !0 : void 0, ...r.columnDef.meta?.attributes ?? {}, children: B(r.columnDef.cell, S()) }, F);
-      }) }),
-      z && /* @__PURE__ */ a(O, { classNameExpandedCell: k, classNameExpandedContent: E, classNameExpandedRow: R, colSpan: n.length, id: m, isExpanded: !!e, isLastRow: s === d.length - 1 && !t, children: o.expandedRow ?? b?.(c) })
-    ] }, m);
-  }) });
+  return /* @__PURE__ */ a("tbody", {
+    className: l("text-slate-800", "text-sm", "font-normal", "relative", "dark:border-x"),
+    children: d.map((x, s) => {
+      const { id: m, original: c, getVisibleCells: j } = x, { meta: o = {} } = c, n = j(), e = N && x.getIsExpanded(), z = !!o.expandedRow || !!b, u = n[0]?.column.id !== "__expand" || y ? 0 : D ? 1 : null;
+      return /* @__PURE__ */ V(O, { children: [/* @__PURE__ */ a("tr", {
+        className: l({ "group/row": p }, "border-b", "border-b-gray-200", "dark:text-metal-50", "dark:border-b-metal-700", "bg-transparent", o.className),
+        "data-row-id": m,
+        ...o.attributes ?? {},
+        children: n.map(({ id: F, column: r, getContext: S }, f) => {
+          const _ = typeof r.columnDef.meta?.className == "function" ? r.columnDef.meta?.className(c) : r.columnDef.meta?.className;
+          return /* @__PURE__ */ a("td", {
+            className: l("px-4", "py-1", "text-sm", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", {
+              "group-hover/row:bg-zinc-100 dark:group-hover/row:bg-metal-800": p,
+              [l("bg-zinc-100 dark:bg-metal-800", C)]: !!e
+            }, v, _, {
+              "rounded-bl-lg": s === d.length - 1 && u !== null && f === u && !t && !e,
+              "rounded-br-lg": s === d.length - 1 && f === n.length - 1 && !t && !e,
+              "dark:[tr:last-child_&]:border-b": !t
+            }),
+            "data-expanded": e ? !0 : void 0,
+            ...r.columnDef.meta?.attributes ?? {},
+            children: A(r.columnDef.cell, S())
+          }, F);
+        })
+      }), z && /* @__PURE__ */ a(M, {
+        classNameExpandedCell: k,
+        classNameExpandedContent: E,
+        classNameExpandedRow: R,
+        colSpan: n.length,
+        id: m,
+        isExpanded: !!e,
+        isLastRow: s === d.length - 1 && !t,
+        children: o.expandedRow ?? b?.(c)
+      })] }, m);
+    })
+  });
 };
 export {
   U as Body

package/dist/components/VirtualizedTable/components/DotPaginate/DotPaginate.js

@@ -1,108 +1,103 @@
-import { jsx as r, jsxs as _ } from "react/jsx-runtime";
-import { c as b } from "../../../../compiler-runtime-DA41awpA.js";
-import { memo as y } from "react";
-import { cn as C } from "../../../../utils/index.js";
-import { C as B } from "../../../../chevron-left-BHBf-gQY.js";
-import { C as V } from "../../../../chevron-right-DvXGOiS_.js";
-import { useTableContext as v } from "../../contexts/table.hook.js";
-const m = y((t) => {
-  const e = b.c(12), {
-    index: l,
-    currentPage: s,
-    handlePage: o
-  } = t;
-  let u;
-  e[0] !== o || e[1] !== l ? (u = () => o(l), e[0] = o, e[1] = l, e[2] = u) : u = e[2];
-  const f = l === s;
-  let a;
-  e[3] !== f ? (a = C("px-2.5 py-1 rounded-lg text-blue-600 cursor-pointer dark:text-aurora-500", {
-    "bg-blue-600 text-white font-semibold dark:bg-aurora-500 dark:text-metal-800": f
-  }), e[3] = f, e[4] = a) : a = e[4];
-  const c = l + 1;
-  let n;
-  e[5] !== u || e[6] !== a || e[7] !== c ? (n = /* @__PURE__ */ r("button", { type: "button", onClick: u, className: a, children: c }), e[5] = u, e[6] = a, e[7] = c, e[8] = n) : n = e[8];
-  let d;
-  return e[9] !== l || e[10] !== n ? (d = /* @__PURE__ */ r("li", { children: n }, l), e[9] = l, e[10] = n, e[11] = d) : d = e[11], d;
-});
-m.displayName = "KonstructPageButton";
-const x = y((t) => {
-  const e = b.c(3), {
-    keyValue: l
-  } = t;
-  let s;
-  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (s = /* @__PURE__ */ r("span", { className: "text-blue-600 select-none dark:text-aurora-500", children: "..." }), e[0] = s) : s = e[0];
-  let o;
-  return e[1] !== l ? (o = /* @__PURE__ */ r("li", { className: "px-2", children: s }, l), e[1] = l, e[2] = o) : o = e[2], o;
-});
-x.displayName = "KonstructEllipsis";
-const k = y((t) => {
-  const e = b.c(10), {
-    direction: l,
-    disabled: s,
-    onClick: o
-  } = t, u = l === "left" ? B : V, f = !s;
-  let a;
-  e[0] !== s || e[1] !== f ? (a = C("h-6 w-6 cursor-pointer", {
-    "text-blue-600 dark:text-aurora-500": f,
-    "text-slate-400 cursor-not-allowed": s
-  }), e[0] = s, e[1] = f, e[2] = a) : a = e[2];
-  let c;
-  e[3] !== u || e[4] !== a ? (c = /* @__PURE__ */ r(u, { className: a }), e[3] = u, e[4] = a, e[5] = c) : c = e[5];
-  let n;
-  return e[6] !== s || e[7] !== o || e[8] !== c ? (n = /* @__PURE__ */ r("li", { className: "flex items-center justify-center", children: /* @__PURE__ */ r("button", { onClick: o, disabled: s, children: c }) }), e[6] = s, e[7] = o, e[8] = c, e[9] = n) : n = e[9], n;
-});
-k.displayName = "KonstructNavigationButton";
-const D = () => {
-  const t = b.c(22), {
-    totalPages: e,
-    page: l,
-    handlePage: s
-  } = v();
-  let o;
-  t[0] !== s || t[1] !== l || t[2] !== e ? (o = () => {
-    if (e <= 5)
-      return Array.from({
-        length: e
-      }, (i, N) => /* @__PURE__ */ r(m, { index: N, currentPage: l, handlePage: s }, N));
-    const p = [];
-    if (l < 3) {
-      for (let i = 0; i < 3; i++)
-        p.push(/* @__PURE__ */ r(m, { index: i, currentPage: l, handlePage: s }, i));
-      p.push(/* @__PURE__ */ r(x, { keyValue: "ellipsis" }, "ellipsis"));
-      for (let i = e - 2; i < e; i++)
-        p.push(/* @__PURE__ */ r(m, { index: i, currentPage: l, handlePage: s }, i));
-    } else if (l >= e - 5) {
-      p.push(/* @__PURE__ */ r(m, { index: 0, currentPage: l, handlePage: s }, 0)), e > 6 && p.push(/* @__PURE__ */ r(x, { keyValue: "ellipsis" }, "ellipsis"));
-      for (let i = Math.max(1, e - 5); i < e; i++)
-        p.push(/* @__PURE__ */ r(m, { index: i, currentPage: l, handlePage: s }, i));
-    } else {
-      p.push(/* @__PURE__ */ r(m, { index: 0, currentPage: l, handlePage: s }, 0)), l > 3 && p.push(/* @__PURE__ */ r(x, { keyValue: "ellipsis1" }, "ellipsis1"));
-      for (let i = l - 1; i <= l + 1; i++)
-        i > 0 && i < e - 1 && p.push(/* @__PURE__ */ r(m, { index: i, currentPage: l, handlePage: s }, i));
-      l < e - 4 && p.push(/* @__PURE__ */ r(x, { keyValue: "ellipsis2" }, "ellipsis2")), p.push(/* @__PURE__ */ r(m, { index: e - 1, currentPage: l, handlePage: s }, e - 1));
-    }
-    return p;
-  }, t[0] = s, t[1] = l, t[2] = e, t[3] = o) : o = t[3];
-  const u = o;
-  let f;
-  t[4] !== s || t[5] !== l ? (f = () => s(l - 1), t[4] = s, t[5] = l, t[6] = f) : f = t[6];
-  const a = l === 0;
-  let c;
-  t[7] !== f || t[8] !== a ? (c = /* @__PURE__ */ r(k, { direction: "left", onClick: f, disabled: a }), t[7] = f, t[8] = a, t[9] = c) : c = t[9];
-  let n;
-  t[10] !== u ? (n = u(), t[10] = u, t[11] = n) : n = t[11];
-  let d;
-  t[12] !== s || t[13] !== l ? (d = () => s(l + 1), t[12] = s, t[13] = l, t[14] = d) : d = t[14];
-  const P = l >= e - 1;
-  let h;
-  t[15] !== d || t[16] !== P ? (h = /* @__PURE__ */ r(k, { direction: "right", onClick: d, disabled: P }), t[15] = d, t[16] = P, t[17] = h) : h = t[17];
-  let g;
-  return t[18] !== c || t[19] !== n || t[20] !== h ? (g = /* @__PURE__ */ _("ul", { className: "flex items-center gap-2", children: [
-    c,
-    n,
-    h
-  ] }), t[18] = c, t[19] = n, t[20] = h, t[21] = g) : g = t[21], g;
+import { t as p } from "../../../../utils-DHuiYnx1.js";
+import { t as d } from "../../../../chevron-left-DRJXef9g.js";
+import { t as m } from "../../../../chevron-right-BooB_b7g.js";
+import { useTableContext as h } from "../../contexts/table.hook.js";
+import { memo as u } from "react";
+import { jsx as i, jsxs as f } from "react/jsx-runtime";
+var l = u(({ index: t, currentPage: e, handlePage: s }) => /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i("button", {
+  type: "button",
+  onClick: () => s(t),
+  className: p("px-2.5 py-1 rounded-lg text-blue-600 cursor-pointer dark:text-aurora-500", { "bg-blue-600 text-white font-semibold dark:bg-aurora-500 dark:text-metal-800": t === e }),
+  children: t + 1
+}) }, t));
+l.displayName = "KonstructPageButton";
+var n = u(({ keyValue: t }) => /* @__PURE__ */ i("li", {
+  className: "px-2",
+  children: /* @__PURE__ */ i("span", {
+    className: "text-blue-600 select-none dark:text-aurora-500",
+    children: "..."
+  })
+}, t));
+n.displayName = "KonstructEllipsis";
+var o = u(({ direction: t, disabled: e, onClick: s }) => /* @__PURE__ */ i("li", {
+  className: "flex items-center justify-center",
+  children: /* @__PURE__ */ i("button", {
+    onClick: s,
+    disabled: e,
+    children: /* @__PURE__ */ i(t === "left" ? d : m, { className: p("h-6 w-6 cursor-pointer", {
+      "text-blue-600 dark:text-aurora-500": !e,
+      "text-slate-400 cursor-not-allowed": e
+    }) })
+  })
+}));
+o.displayName = "KonstructNavigationButton";
+var v = () => {
+  const { totalPages: t, page: e, handlePage: s } = h();
+  return /* @__PURE__ */ f("ul", {
+    className: "flex items-center gap-2",
+    children: [
+      /* @__PURE__ */ i(o, {
+        direction: "left",
+        onClick: () => s(e - 1),
+        disabled: e === 0
+      }),
+      (() => {
+        if (t <= 5) return Array.from({ length: t }, (r, c) => /* @__PURE__ */ i(l, {
+          index: c,
+          currentPage: e,
+          handlePage: s
+        }, c));
+        const a = [];
+        if (e < 3) {
+          for (let r = 0; r < 3; r++) a.push(/* @__PURE__ */ i(l, {
+            index: r,
+            currentPage: e,
+            handlePage: s
+          }, r));
+          a.push(/* @__PURE__ */ i(n, { keyValue: "ellipsis" }, "ellipsis"));
+          for (let r = t - 2; r < t; r++) a.push(/* @__PURE__ */ i(l, {
+            index: r,
+            currentPage: e,
+            handlePage: s
+          }, r));
+        } else if (e >= t - 5) {
+          a.push(/* @__PURE__ */ i(l, {
+            index: 0,
+            currentPage: e,
+            handlePage: s
+          }, 0)), t > 6 && a.push(/* @__PURE__ */ i(n, { keyValue: "ellipsis" }, "ellipsis"));
+          for (let r = Math.max(1, t - 5); r < t; r++) a.push(/* @__PURE__ */ i(l, {
+            index: r,
+            currentPage: e,
+            handlePage: s
+          }, r));
+        } else {
+          a.push(/* @__PURE__ */ i(l, {
+            index: 0,
+            currentPage: e,
+            handlePage: s
+          }, 0)), e > 3 && a.push(/* @__PURE__ */ i(n, { keyValue: "ellipsis1" }, "ellipsis1"));
+          for (let r = e - 1; r <= e + 1; r++) r > 0 && r < t - 1 && a.push(/* @__PURE__ */ i(l, {
+            index: r,
+            currentPage: e,
+            handlePage: s
+          }, r));
+          e < t - 4 && a.push(/* @__PURE__ */ i(n, { keyValue: "ellipsis2" }, "ellipsis2")), a.push(/* @__PURE__ */ i(l, {
+            index: t - 1,
+            currentPage: e,
+            handlePage: s
+          }, t - 1));
+        }
+        return a;
+      })(),
+      /* @__PURE__ */ i(o, {
+        direction: "right",
+        onClick: () => s(e + 1),
+        disabled: e >= t - 1
+      })
+    ]
+  });
 };
 export {
-  D as DotPaginate
+  v as DotPaginate
 };

package/dist/components/VirtualizedTable/components/DropdownPaginate/DropdownPaginate.js

@@ -1,27 +1,25 @@
-import { jsxs as i, jsx as o } from "react/jsx-runtime";
-import { useMemo as l, useCallback as p } from "react";
-import { Select as c } from "../../../Select/Select.js";
-import { DEFAULT_PAGE_SIZES as g } from "../../constants/pagination.js";
-import { useTableContext as d } from "../../contexts/table.hook.js";
-const u = ({
-  pageSizes: m = g
-}) => {
-  const {
-    pageSize: r,
-    onPageSize: t,
-    handlePage: a
-  } = d(), s = l(() => m.map(String).map((e) => ({
+import { Select as i } from "../../../Select/Select.js";
+import { DEFAULT_PAGE_SIZES as l } from "../../constants/pagination.js";
+import { useTableContext as p } from "../../contexts/table.hook.js";
+import { useCallback as g, useMemo as c } from "react";
+import { jsx as o, jsxs as d } from "react/jsx-runtime";
+var u = ({ pageSizes: m = l }) => {
+  const { pageSize: r, onPageSize: t, handlePage: a } = p(), s = c(() => m.map(String).map((e) => ({
     label: e,
     value: e
-  })), []), n = p((e) => {
+  })), []), n = g((e) => {
     t(Number(e)), a(0);
   }, [a, t]);
-  return /* @__PURE__ */ i("div", { className: "flex items-center gap-2 dark:text-metal-300", children: [
-    /* @__PURE__ */ o("span", { children: "Show" }),
-    /* @__PURE__ */ o(c, { className: "w-22 [&>div>p]:text-sm bg-white", listItemClassName: "[&>p]:text-sm dark:bg-metal-800", options: s, value: r.toString(), onChange: ({
-      target: e
-    }) => n(e.value) })
-  ] });
+  return /* @__PURE__ */ d("div", {
+    className: "flex items-center gap-2 dark:text-metal-300",
+    children: [/* @__PURE__ */ o("span", { children: "Show" }), /* @__PURE__ */ o(i, {
+      className: "w-22 [&>div>p]:text-sm bg-white",
+      listItemClassName: "[&>p]:text-sm dark:bg-metal-800",
+      options: s,
+      value: r.toString(),
+      onChange: ({ target: e }) => n(e.value)
+    })]
+  });
 };
 export {
   u as DropdownPaginate

package/dist/components/VirtualizedTable/components/ExpandableRow/ExpandableRow.js

@@ -1,45 +1,31 @@
-import { jsx as b } from "react/jsx-runtime";
-import { c as E } from "../../../../compiler-runtime-DA41awpA.js";
-import { cn as m } from "../../../../utils/index.js";
-const R = (k) => {
-  const e = E.c(25), {
-    children: p,
-    classNameExpandedCell: f,
-    classNameExpandedContent: g,
-    classNameExpandedRow: x,
-    colSpan: w,
-    id: h,
-    isExpanded: r,
-    isLastRow: d
-  } = k;
-  let t;
-  e[0] !== x ? (t = m("h-0 leading-0", x), e[0] = x, e[1] = t) : t = e[1];
-  let a;
-  e[2] !== r || e[3] !== d ? (a = m("p-0 bg-white dark:bg-metal-900 dark:border-x dark:border-metal-700", {
-    "rounded-b-lg": d
-  }, {
-    "border-t border-b border-gray-200 dark:border-t-metal-700": r && d,
-    "border-t border-b border-gray-200 dark:border-t-metal-700 dark:border-b-0": r && !d,
-    "border-y-0": !r && !d,
-    "border-t-0 border-b border-b-gray-200 dark:border-b-metal-700": !r && d
-  }), e[2] = r, e[3] = d, e[4] = a) : a = e[4];
-  const N = !r;
-  let o;
-  e[5] !== g || e[6] !== r || e[7] !== N ? (o = m("grid transition-[grid-template-rows] duration-300 ease-in-out", {
-    "grid-rows-[1fr]": r,
-    "grid-rows-[0fr]": N
-  }, g), e[5] = g, e[6] = r, e[7] = N, e[8] = o) : o = e[8];
-  let l;
-  e[9] !== f ? (l = m("px-4 py-3", f), e[9] = f, e[10] = l) : l = e[10];
-  let s;
-  e[11] !== p || e[12] !== l ? (s = /* @__PURE__ */ b("div", { className: "overflow-hidden", children: /* @__PURE__ */ b("div", { className: l, children: p }) }), e[11] = p, e[12] = l, e[13] = s) : s = e[13];
-  let i;
-  e[14] !== o || e[15] !== s ? (i = /* @__PURE__ */ b("div", { className: o, children: s }), e[14] = o, e[15] = s, e[16] = i) : i = e[16];
-  let n;
-  e[17] !== w || e[18] !== a || e[19] !== i ? (n = /* @__PURE__ */ b("td", { colSpan: w, className: a, children: i }), e[17] = w, e[18] = a, e[19] = i, e[20] = n) : n = e[20];
-  let c;
-  return e[21] !== h || e[22] !== t || e[23] !== n ? (c = /* @__PURE__ */ b("tr", { className: t, "data-expanded-row-id": h, children: n }), e[21] = h, e[22] = t, e[23] = n, e[24] = c) : c = e[24], c;
-};
+import { t as a } from "../../../../utils-DHuiYnx1.js";
+import { jsx as d } from "react/jsx-runtime";
+var n = ({ children: o, classNameExpandedCell: b, classNameExpandedContent: t, classNameExpandedRow: l, colSpan: m, id: i, isExpanded: r, isLastRow: e }) => /* @__PURE__ */ d("tr", {
+  className: a("h-0 leading-0", l),
+  "data-expanded-row-id": i,
+  children: /* @__PURE__ */ d("td", {
+    colSpan: m,
+    className: a("p-0 bg-white dark:bg-metal-900 dark:border-x dark:border-metal-700", { "rounded-b-lg": e }, {
+      "border-t border-b border-gray-200 dark:border-t-metal-700": r && e,
+      "border-t border-b border-gray-200 dark:border-t-metal-700 dark:border-b-0": r && !e,
+      "border-y-0": !r && !e,
+      "border-t-0 border-b border-b-gray-200 dark:border-b-metal-700": !r && e
+    }),
+    children: /* @__PURE__ */ d("div", {
+      className: a("grid transition-[grid-template-rows] duration-300 ease-in-out", {
+        "grid-rows-[1fr]": r,
+        "grid-rows-[0fr]": !r
+      }, t),
+      children: /* @__PURE__ */ d("div", {
+        className: "overflow-hidden",
+        children: /* @__PURE__ */ d("div", {
+          className: a("px-4 py-3", b),
+          children: o
+        })
+      })
+    })
+  })
+});
 export {
-  R as ExpandableRow
+  n as ExpandableRow
 };