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

package/dist/components/VirtualizedTable/components/Filter/Filter.js

@@ -1,121 +1,114 @@
-import { jsx as s, jsxs as W } from "react/jsx-runtime";
-import { c as ae } from "../../../../compiler-runtime-DA41awpA.js";
-import { d as ne } from "../../../../debounce-DJveWHr_.js";
-import { useRef as re } from "react";
-import { Button as ce } from "../../../Button/Button.js";
-import { Filter as a } from "../../../Filter/Filter.js";
-import { Input as ie } from "../../../Input/Input.js";
-import { cn as pe } from "../../../../utils/index.js";
-import { useTableContext as me } from "../../contexts/table.hook.js";
-const Oe = (m) => {
-  const e = ae.c(44), {
-    actions: T,
-    filters: B,
-    multiSelectFilter: O,
-    placeholder: A,
-    showFilterInput: X,
-    showResetButton: Y,
-    resetButtonClassName: f,
-    closeOnApply: Z
-  } = m, j = X === void 0 ? !0 : X, M = Y === void 0 ? !0 : Y, k = Z === void 0 ? !0 : Z, I = re(null), {
-    termOfSearch: P,
-    multiselectSelected: _,
-    dateFilters: N,
-    dateRangeFilters: $,
-    timeFilters: g,
-    onChangeTermOfSearch: n,
-    onSelectMultiselect: E,
-    onSelectDateFilter: q,
-    onSelectDateRangeFilter: z,
-    onSelectTimeFilter: G
-  } = me();
-  let h;
-  e[0] !== B || e[1] !== O ? (h = B ?? O?.map(ue) ?? [], e[0] = B, e[1] = O, e[2] = h) : h = e[2];
-  const H = h;
-  let y;
-  e[3] !== T ? (y = T ?? [], e[3] = T, e[4] = y) : y = e[4];
-  const J = y;
-  let F;
-  e[5] !== H || e[6] !== J ? (F = [...H, ...J], e[5] = H, e[6] = J, e[7] = F) : F = e[7];
-  const K = F;
-  let b;
-  e[8] !== E ? (b = (t, o) => E(t, o.map(de)), e[8] = E, e[9] = b) : b = e[9];
-  const v = b;
-  let w;
-  e[10] !== n ? (w = () => {
-    n(""), I.current && (I.current.value = "");
-  }, e[10] = n, e[11] = w) : w = e[11];
-  const L = w;
-  let R;
-  e[12] !== n ? (R = ne((t) => {
-    n(t.target.value);
-  }, 500), e[12] = n, e[13] = R) : R = e[13];
-  const Q = R;
-  let S;
-  e[14] !== N || e[15] !== $ || e[16] !== _ || e[17] !== P || e[18] !== g ? (S = !!P || Object.values(_ ?? {}).flat().length > 0 || Object.values(N ?? {}).some(Boolean) || Object.values($ ?? {}).some(Boolean) || Object.values(g ?? {}).some(Boolean), e[14] = N, e[15] = $, e[16] = _, e[17] = P, e[18] = g, e[19] = S) : S = e[19];
-  const U = S;
-  let D;
-  e[20] !== v || e[21] !== q || e[22] !== z || e[23] !== G ? (D = (t) => {
-    if (t.type === "action") {
-      const {
-        label: l,
-        appearance: ee,
-        variant: te,
-        leftIcon: oe,
-        rightIcon: le,
-        type: he,
-        ...se
-      } = t;
-      return /* @__PURE__ */ W(ce, { appearance: ee === void 0 ? "compact" : ee, variant: te === void 0 ? "secondary" : te, ...se, children: [
-        oe,
-        l,
-        le
-      ] }, l);
+import { o as G } from "../../../../chunk-D1xtDmiO.js";
+import { t as H } from "../../../../Input-GBMxM3Z7.js";
+import { t as J } from "../../../../utils-DHuiYnx1.js";
+import { Button as K } from "../../../Button/Button.js";
+import { Filter as r } from "../../../Filter/Filter.js";
+import { t as L } from "../../../../debounce-CzFlgg9h.js";
+import { useTableContext as Q } from "../../contexts/table.hook.js";
+import { useCallback as v, useMemo as m, useRef as U } from "react";
+import { jsx as s, jsxs as p } from "react/jsx-runtime";
+var V = /* @__PURE__ */ G(L(), 1), re = ({ actions: u, filters: d, multiSelectFilter: i, placeholder: w, showFilterInput: T = !0, showResetButton: x = !0, resetButtonClassName: M, closeOnApply: j = !0 }) => {
+  const l = U(null), { termOfSearch: h, multiselectSelected: y, dateFilters: F, dateRangeFilters: b, timeFilters: S, onChangeTermOfSearch: c, onSelectMultiselect: D, onSelectDateFilter: O, onSelectDateRangeFilter: A, onSelectTimeFilter: B } = Q(), k = m(() => {
+    const e = d ?? i?.map((o) => ({
+      ...o,
+      type: "badgeMultiSelect"
+    })) ?? [], t = u ?? [];
+    return [...e, ...t];
+  }, [
+    d,
+    i,
+    u
+  ]), R = v((e, t) => D(e, t.map((o) => o.id)), [D]), P = v(() => {
+    c(""), l.current && (l.current.value = "");
+  }, [c]), _ = m(() => (0, V.default)((e) => {
+    c(e.target.value);
+  }, 500), [c]), I = m(() => !!h || Object.values(y ?? {}).flat().length > 0 || Object.values(F ?? {}).some(Boolean) || Object.values(b ?? {}).some(Boolean) || Object.values(S ?? {}).some(Boolean), [
+    h,
+    y,
+    F,
+    b,
+    S
+  ]), N = (e) => {
+    if (e.type === "action") {
+      const { label: a, appearance: g = "compact", variant: q = "secondary", leftIcon: E, rightIcon: $, type: W, ...z } = e;
+      return /* @__PURE__ */ p(K, {
+        appearance: g,
+        variant: q,
+        ...z,
+        children: [
+          E,
+          a,
+          $
+        ]
+      }, a);
     }
-    const {
-      key: o,
-      label: u,
-      position: C
-    } = t, d = C === void 0 ? "right" : C;
-    return t.type === "textMultiSelect" ? /* @__PURE__ */ s(a.TextMultiSelect, { label: u, position: d, options: t.options, onApply: (l) => {
-      v(o, l);
-    } }, o) : t.type === "date" ? /* @__PURE__ */ s(a.DateFilterDropdown, { label: u, position: d, countryCode: t.countryCode, onApply: (l) => {
-      q(o, l);
-    } }, o) : t.type === "dateRange" ? /* @__PURE__ */ s(a.DateRangeFilterDropdown, { label: u, position: d, showTime: t.showTime, timeFormat: t.timeFormat, showPresets: t.showPresets, defaultRange: t.defaultRange, minDate: t.minDate, maxDate: t.maxDate, countryCode: t.countryCode, onApply: (l) => {
-      z(o, l);
-    }, onRangeChange: t.onRangeChange }, o) : t.type === "time" ? /* @__PURE__ */ s(a.TimeFilterDropdown, { label: u, position: d, format: t.format, presets: t.presets, showTimePicker: t.showTimePicker, onApply: (l) => {
-      G(o, l);
-    } }, o) : /* @__PURE__ */ s(a.BadgeMultiSelect, { label: u, position: d, options: t.options, onApply: (l) => {
-      v(o, l);
-    } }, o);
-  }, e[20] = v, e[21] = q, e[22] = z, e[23] = G, e[24] = D) : D = e[24];
-  const V = D;
-  let r;
-  e[25] !== Q || e[26] !== A || e[27] !== j ? (r = j && /* @__PURE__ */ s(ie, { ref: I, placeholder: A, isSearch: !0, autoComplete: "false", className: "w-72", inputMode: "search", onChange: Q }), e[25] = Q, e[26] = A, e[27] = j, e[28] = r) : r = e[28];
-  let c;
-  e[29] !== V || e[30] !== K ? (c = K.map(V), e[29] = V, e[30] = K, e[31] = c) : c = e[31];
-  let i;
-  e[32] !== L || e[33] !== U || e[34] !== f || e[35] !== M ? (i = M && /* @__PURE__ */ s(a.ResetButton, { className: pe("select-none", f), disabled: !U, onClick: L }), e[32] = L, e[33] = U, e[34] = f, e[35] = M, e[36] = i) : i = e[36];
-  let p;
-  e[37] !== k || e[38] !== c || e[39] !== i ? (p = /* @__PURE__ */ W(a, { closeOnApply: k, children: [
-    c,
-    i
-  ] }), e[37] = k, e[38] = c, e[39] = i, e[40] = p) : p = e[40];
-  let x;
-  return e[41] !== r || e[42] !== p ? (x = /* @__PURE__ */ W("div", { className: "w-full flex items-center justify-end pb-6", children: [
-    r,
-    p
-  ] }), e[41] = r, e[42] = p, e[43] = x) : x = e[43], x;
-};
-function ue(m) {
-  return {
-    ...m,
-    type: "badgeMultiSelect"
+    const { key: t, label: o, position: n = "right" } = e;
+    return e.type === "textMultiSelect" ? /* @__PURE__ */ s(r.TextMultiSelect, {
+      label: o,
+      position: n,
+      options: e.options,
+      onApply: (a) => {
+        R(t, a);
+      }
+    }, t) : e.type === "date" ? /* @__PURE__ */ s(r.DateFilterDropdown, {
+      label: o,
+      position: n,
+      countryCode: e.countryCode,
+      onApply: (a) => {
+        O(t, a);
+      }
+    }, t) : e.type === "dateRange" ? /* @__PURE__ */ s(r.DateRangeFilterDropdown, {
+      label: o,
+      position: n,
+      showTime: e.showTime,
+      timeFormat: e.timeFormat,
+      showPresets: e.showPresets,
+      defaultRange: e.defaultRange,
+      minDate: e.minDate,
+      maxDate: e.maxDate,
+      countryCode: e.countryCode,
+      onApply: (a) => {
+        A(t, a);
+      },
+      onRangeChange: e.onRangeChange
+    }, t) : e.type === "time" ? /* @__PURE__ */ s(r.TimeFilterDropdown, {
+      label: o,
+      position: n,
+      format: e.format,
+      presets: e.presets,
+      showTimePicker: e.showTimePicker,
+      onApply: (a) => {
+        B(t, a);
+      }
+    }, t) : /* @__PURE__ */ s(r.BadgeMultiSelect, {
+      label: o,
+      position: n,
+      options: e.options,
+      onApply: (a) => {
+        R(t, a);
+      }
+    }, t);
   };
-}
-function de(m) {
-  return m.id;
-}
+  return /* @__PURE__ */ p("div", {
+    className: "w-full flex items-center justify-end pb-6",
+    children: [T && /* @__PURE__ */ s(H, {
+      ref: l,
+      placeholder: w,
+      isSearch: !0,
+      autoComplete: "false",
+      className: "w-72",
+      inputMode: "search",
+      onChange: _
+    }), /* @__PURE__ */ p(r, {
+      closeOnApply: j,
+      children: [k.map(N), x && /* @__PURE__ */ s(r.ResetButton, {
+        className: J("select-none", M),
+        disabled: !I,
+        onClick: P
+      })]
+    })]
+  });
+};
 export {
-  Oe as Filter
+  re as Filter
 };

package/dist/components/VirtualizedTable/components/FormPaginate/FormPaginate.js

@@ -1,35 +1,45 @@
-import { jsx as l, jsxs as g } from "react/jsx-runtime";
-import { c as b } from "../../../../compiler-runtime-DA41awpA.js";
-import { useRef as h } from "react";
-import { Input as d } from "../../../Input/Input.js";
-import { Typography as y } from "../../../Typography/Typography.js";
-import { Button as j } from "../../../Button/Button.js";
-import { useTableContext as N } from "../../contexts/table.hook.js";
-const k = () => {
-  const e = b.c(10), c = h(null), {
-    totalPages: t,
-    handlePage: s
-  } = N();
-  let r;
-  e[0] !== s || e[1] !== t ? (r = (p) => {
-    p.preventDefault();
-    const u = new FormData(p.currentTarget), f = Number(u.get("jump-to")), x = (f < t ? f : t) || 1;
-    s(x - 1), c.current?.reset();
-  }, e[0] = s, e[1] = t, e[2] = r) : r = e[2];
-  const i = r;
-  let m;
-  e[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = /* @__PURE__ */ l(y, { component: "span", className: "text-sm min-w-fit tracking-normal", children: "Jump to" }), e[3] = m) : m = e[3];
-  let o;
-  e[4] !== t ? (o = /* @__PURE__ */ l(d, { type: "number", className: "w-18 text-sm no-spinner", name: "jump-to", min: 1, max: t, required: !0, autoComplete: "off" }), e[4] = t, e[5] = o) : o = e[5];
-  let n;
-  e[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ l(j, { variant: "link", type: "submit", className: "text-xs p-2 cursor-pointer", children: "Go" }), e[6] = n) : n = e[6];
-  let a;
-  return e[7] !== i || e[8] !== o ? (a = /* @__PURE__ */ g("form", { "aria-label": "footer-pagination", ref: c, onSubmit: i, className: "flex items-center gap-2", noValidate: !0, children: [
-    m,
-    o,
-    n
-  ] }), e[7] = i, e[8] = o, e[9] = a) : a = e[9], a;
+import { t as i } from "../../../../Input-GBMxM3Z7.js";
+import { Button as p } from "../../../Button/Button.js";
+import { Typography as u } from "../../../Typography/Typography.js";
+import { useTableContext as l } from "../../contexts/table.hook.js";
+import { useCallback as c, useRef as f } from "react";
+import { jsx as e, jsxs as x } from "react/jsx-runtime";
+var y = () => {
+  const r = f(null), { totalPages: t, handlePage: o } = l(), n = c((a) => {
+    a.preventDefault();
+    const s = new FormData(a.currentTarget), m = Number(s.get("jump-to"));
+    o(((m < t ? m : t) || 1) - 1), r.current?.reset();
+  }, [o, t]);
+  return /* @__PURE__ */ x("form", {
+    "aria-label": "footer-pagination",
+    ref: r,
+    onSubmit: n,
+    className: "flex items-center gap-2",
+    noValidate: !0,
+    children: [
+      /* @__PURE__ */ e(u, {
+        component: "span",
+        className: "text-sm min-w-fit tracking-normal",
+        children: "Jump to"
+      }),
+      /* @__PURE__ */ e(i, {
+        type: "number",
+        className: "w-18 text-sm no-spinner",
+        name: "jump-to",
+        min: 1,
+        max: t,
+        required: !0,
+        autoComplete: "off"
+      }),
+      /* @__PURE__ */ e(p, {
+        variant: "link",
+        type: "submit",
+        className: "text-xs p-2 cursor-pointer",
+        children: "Go"
+      })
+    ]
+  });
 };
 export {
-  k as FormPaginate
+  y as FormPaginate
 };

package/dist/components/VirtualizedTable/components/Header/Header.js

@@ -1,65 +1,40 @@
-import { jsx as i, jsxs as g } from "react/jsx-runtime";
-import { c as A } from "../../../../compiler-runtime-DA41awpA.js";
-import { f as j } from "../../../../index-CSWGJT-v.js";
-import { cn as m } from "../../../../utils/index.js";
-import D from "../../assets/chevron-up.js";
-import y from "../../assets/chevron-down.js";
-import { useTableContext as H } from "../../contexts/table.hook.js";
-const q = (b) => {
-  const e = A.c(20), {
-    className: u,
-    classNameArrows: n,
-    classNameActiveArrows: s
-  } = b, {
-    table: h,
-    onSorting: o
-  } = H();
-  let f;
-  e[0] !== o ? (f = (t) => o([{
+import { t as r } from "../../../../utils-DHuiYnx1.js";
+import { n as b } from "../../../../table.provider-4OQNqxH3.js";
+import { useTableContext as g } from "../../contexts/table.hook.js";
+import u from "../../assets/chevron-up.js";
+import k from "../../assets/chevron-down.js";
+import { useCallback as d } from "react";
+import { jsx as a, jsxs as l } from "react/jsx-runtime";
+var y = ({ className: n, classNameArrows: i, classNameActiveArrows: o }) => {
+  const { table: c, onSorting: s } = g(), m = d((t) => s([{
     id: t.id,
     desc: !1
-  }]), e[0] = o, e[1] = f) : f = e[1];
-  const c = f;
-  let p;
-  e[2] !== o ? (p = (t) => o([{
+  }]), [s]), p = d((t) => s([{
     id: t.id,
     desc: !0
-  }]), e[2] = o, e[3] = p) : p = e[3];
-  const d = p;
-  let a;
-  e[4] !== u ? (a = m("font-semibold", "uppercase", "text-slate-500", "text-xs", "not-italic", "bg-slate-100", "overflow-hidden", "dark:text-slate-300", "dark:bg-metal-800", u), e[4] = u, e[5] = a) : a = e[5];
-  let l;
-  if (e[6] !== s || e[7] !== n || e[8] !== c || e[9] !== d || e[10] !== h) {
-    let t;
-    e[12] !== s || e[13] !== n || e[14] !== c || e[15] !== d ? (t = (k) => {
-      const {
-        id: N,
-        headers: C
-      } = k;
-      return /* @__PURE__ */ i("tr", { children: C.map((S) => {
-        const {
-          id: w,
-          column: r,
-          getContext: v
-        } = S;
-        return /* @__PURE__ */ i("th", { scope: "col", className: m("px-4", "py-3", "text-left", "text-xs", "first:rounded-tl-lg", "last:rounded-tr-lg", "border-transparent", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", r.columnDef.meta?.headerClassName), children: /* @__PURE__ */ g("span", { className: "flex items-center gap-2 w-full", children: [
-          j(r.columnDef.header, v()),
-          r.getCanSort() && /* @__PURE__ */ g("div", { className: m("flex flex-col text-slate-400 justify-center items-center gap-1", n), role: "presentation", children: [
-            /* @__PURE__ */ i(D, { className: m("w-2 h-2 cursor-pointer", {
-              "text-blue-600 dark:text-aurora-500": r.getIsSorted() === "asc"
-            }, s), onClick: () => c(r) }),
-            /* @__PURE__ */ i(y, { className: m("w-2 h-2 cursor-pointer", {
-              "text-blue-600 dark:text-aurora-500": r.getIsSorted() === "desc"
-            }, s), onClick: () => d(r) })
-          ] })
-        ] }) }, w);
-      }) }, N);
-    }, e[12] = s, e[13] = n, e[14] = c, e[15] = d, e[16] = t) : t = e[16], l = h.getHeaderGroups().map(t), e[6] = s, e[7] = n, e[8] = c, e[9] = d, e[10] = h, e[11] = l;
-  } else
-    l = e[11];
-  let x;
-  return e[17] !== a || e[18] !== l ? (x = /* @__PURE__ */ i("thead", { className: a, children: l }), e[17] = a, e[18] = l, e[19] = x) : x = e[19], x;
+  }]), [s]);
+  return /* @__PURE__ */ a("thead", {
+    className: r("font-semibold", "uppercase", "text-slate-500", "text-xs", "not-italic", "bg-slate-100", "overflow-hidden", "dark:text-slate-300", "dark:bg-metal-800", n),
+    children: c.getHeaderGroups().map(({ id: t, headers: f }) => /* @__PURE__ */ a("tr", { children: f.map(({ id: x, column: e, getContext: h }) => /* @__PURE__ */ a("th", {
+      scope: "col",
+      className: r("px-4", "py-3", "text-left", "text-xs", "first:rounded-tl-lg", "last:rounded-tr-lg", "border-transparent", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", e.columnDef.meta?.headerClassName),
+      children: /* @__PURE__ */ l("span", {
+        className: "flex items-center gap-2 w-full",
+        children: [b(e.columnDef.header, h()), e.getCanSort() && /* @__PURE__ */ l("div", {
+          className: r("flex flex-col text-slate-400 justify-center items-center gap-1", i),
+          role: "presentation",
+          children: [/* @__PURE__ */ a(u, {
+            className: r("w-2 h-2 cursor-pointer", { "text-blue-600 dark:text-aurora-500": e.getIsSorted() === "asc" }, o),
+            onClick: () => m(e)
+          }), /* @__PURE__ */ a(k, {
+            className: r("w-2 h-2 cursor-pointer", { "text-blue-600 dark:text-aurora-500": e.getIsSorted() === "desc" }, o),
+            onClick: () => p(e)
+          })]
+        })]
+      })
+    }, x)) }, t))
+  });
 };
 export {
-  q as Header
+  y as Header
 };

package/dist/components/VirtualizedTable/components/Pagination/Pagination.js

@@ -1,68 +1,32 @@
-import { jsxs as f, jsx as c, Fragment as j } from "react/jsx-runtime";
-import { c as L } from "../../../../compiler-runtime-DA41awpA.js";
-import { DotPaginate as S } from "../DotPaginate/DotPaginate.js";
-import { DropdownPaginate as A } from "../DropdownPaginate/DropdownPaginate.js";
-import { FormPaginate as R } from "../FormPaginate/FormPaginate.js";
-import { cn as z } from "../../../../utils/index.js";
-import { useTableContext as C } from "../../contexts/table.hook.js";
-import { DEFAULT_PAGE_SIZE as G } from "../../constants/pagination.js";
-const M = (k) => {
-  const t = L.c(28), {
-    showTotalItems: N,
-    showDropdownPagination: D,
-    showDotPagination: F,
-    showFormPagination: I,
-    pageSizes: h,
-    classNamePagination: x,
-    isLoading: E
-  } = k, u = N === void 0 ? !0 : N, w = D === void 0 ? !0 : D, b = F === void 0 ? !0 : F, P = I === void 0 ? !0 : I, {
-    totalItems: y,
-    tableFetching: T,
-    isFirstLoad: _
-  } = C(), d = y === void 0 ? -1 / 0 : y;
-  if (d <= G || T || E)
-    return null;
-  const v = !_;
-  let e;
-  t[0] !== x || t[1] !== v ? (e = z("bg-slate-50", "border", "border-y-transparent", "border-x-slate-100", "text-slate-500", "text-sm", "not-italic", "py-2", "px-6", "rounded-b-lg", "shadow", "dark:bg-metal-800", "dark:border-x-metal-700", "dark:border-b-metal-700", x, {
-    "animate-in fade-in-10": v
-  }), t[0] = x, t[1] = v, t[2] = e) : e = t[2];
-  let o;
-  t[3] !== u || t[4] !== d ? (o = d && u ? /* @__PURE__ */ f("span", { className: "text-slate-800 dark:text-metal-300", children: [
-    d,
-    " Results"
-  ] }) : null, t[3] = u, t[4] = d, t[5] = o) : o = t[5];
-  let i;
-  t[6] !== h || t[7] !== w ? (i = w && /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ c(A, { pageSizes: h }) }), t[6] = h, t[7] = w, t[8] = i) : i = t[8];
-  let s;
-  t[9] !== o || t[10] !== i ? (s = /* @__PURE__ */ f("div", { className: "flex items-center gap-6", children: [
-    o,
-    i
-  ] }), t[9] = o, t[10] = i, t[11] = s) : s = t[11];
-  let a;
-  t[12] !== b ? (a = b && /* @__PURE__ */ c(S, {}), t[12] = b, t[13] = a) : a = t[13];
-  let l;
-  t[14] !== P ? (l = P && /* @__PURE__ */ c(R, {}), t[14] = P, t[15] = l) : l = t[15];
-  let n;
-  t[16] !== a || t[17] !== l ? (n = /* @__PURE__ */ f("div", { className: "flex items-center gap-8", children: [
-    a,
-    l
-  ] }), t[16] = a, t[17] = l, t[18] = n) : n = t[18];
-  let r;
-  t[19] !== s || t[20] !== n ? (r = /* @__PURE__ */ f("div", { className: "flex items-center justify-between", children: [
-    s,
-    n
-  ] }), t[19] = s, t[20] = n, t[21] = r) : r = t[21];
-  let m;
-  t[22] !== r || t[23] !== e ? (m = /* @__PURE__ */ c("div", { className: e, children: r }), t[22] = r, t[23] = e, t[24] = m) : m = t[24];
-  let p;
-  t[25] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (p = /* @__PURE__ */ c("div", { className: "w-full min-h-37.5" }), t[25] = p) : p = t[25];
-  let g;
-  return t[26] !== m ? (g = /* @__PURE__ */ f(j, { children: [
-    m,
-    p
-  ] }), t[26] = m, t[27] = g) : g = t[27], g;
+import { t as f } from "../../../../utils-DHuiYnx1.js";
+import "../../constants/pagination.js";
+import { useTableContext as p } from "../../contexts/table.hook.js";
+import { DotPaginate as x } from "../DotPaginate/DotPaginate.js";
+import { DropdownPaginate as u } from "../DropdownPaginate/DropdownPaginate.js";
+import { FormPaginate as b } from "../FormPaginate/FormPaginate.js";
+import { Fragment as g, jsx as e, jsxs as t } from "react/jsx-runtime";
+var j = ({ showTotalItems: a = !0, showDropdownPagination: i = !0, showDotPagination: l = !0, showFormPagination: n = !0, pageSizes: s, classNamePagination: m, isLoading: o }) => {
+  const { totalItems: r = -1 / 0, tableFetching: d, isFirstLoad: c } = p();
+  return r <= 10 || d || o ? null : /* @__PURE__ */ t(g, { children: [/* @__PURE__ */ e("div", {
+    className: f("bg-slate-50", "border", "border-y-transparent", "border-x-slate-100", "text-slate-500", "text-sm", "not-italic", "py-2", "px-6", "rounded-b-lg", "shadow", "dark:bg-metal-800", "dark:border-x-metal-700", "dark:border-b-metal-700", m, { "animate-in fade-in-10": !c }),
+    children: /* @__PURE__ */ t("div", {
+      className: "flex items-center justify-between",
+      children: [/* @__PURE__ */ t("div", {
+        className: "flex items-center gap-6",
+        children: [r && a ? /* @__PURE__ */ t("span", {
+          className: "text-slate-800 dark:text-metal-300",
+          children: [r, " Results"]
+        }) : null, i && /* @__PURE__ */ e("div", {
+          className: "flex items-center gap-2",
+          children: /* @__PURE__ */ e(u, { pageSizes: s })
+        })]
+      }), /* @__PURE__ */ t("div", {
+        className: "flex items-center gap-8",
+        children: [l && /* @__PURE__ */ e(x, {}), n && /* @__PURE__ */ e(b, {})]
+      })]
+    })
+  }), /* @__PURE__ */ e("div", { className: "w-full min-h-37.5" })] });
 };
 export {
-  M as Pagination
+  j as Pagination
 };

package/dist/components/VirtualizedTable/components/Skeleton/Skeleton.js

@@ -1,36 +1,43 @@
+import { t as l } from "../../../../utils-DHuiYnx1.js";
+import { Button as m } from "../../../Button/Button.js";
+import { t as c } from "../../../../ellipsis-vertical-My0S9QY5.js";
+import { useTableContext as h } from "../../contexts/table.hook.js";
 import { jsx as r } from "react/jsx-runtime";
-import { c as p } from "../../../../compiler-runtime-DA41awpA.js";
-import { Button as f } from "../../../Button/Button.js";
-import { cn as s } from "../../../../utils/index.js";
-import { useTableContext as k } from "../../contexts/table.hook.js";
-import { E as u } from "../../../../ellipsis-vertical-Cl3yNtOy.js";
-const E = (g) => {
-  const t = p.c(7), {
-    numberOfRows: n,
-    table: m
-  } = g, {
-    tableFetching: b,
-    tableLoading: c
-  } = k();
-  let d;
-  t[0] !== n ? (d = Array.from({
-    length: n
-  }), t[0] = n, t[1] = d) : d = t[1];
-  const e = d;
-  let i;
-  return t[2] !== e || t[3] !== m || t[4] !== b || t[5] !== c ? (i = /* @__PURE__ */ r("tbody", { className: "text-slate-800 text-sm font-normal relative", children: e.map((y, a) => {
-    const h = m.getAllColumns();
-    return /* @__PURE__ */ r("tr", { className: s("border-b", "border-b-gray-200", "bg-transparent", "last:border-b-transparent"), children: h.map((l, o) => l.id !== "actions" ? /* @__PURE__ */ r("td", { className: s("px-4", "py-1", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", "dark:[tr:last-child_&]:border-b", l.columnDef.meta?.className, {
-      "[tr:last-child_&:first-of-type]:rounded-bl-lg": a === e.length - 1 && o === 0,
-      "[tr:last-child_&:last-of-type]:rounded-br-lg": a === e.length - 1 && o === h.length - 1
-    }), children: /* @__PURE__ */ r("div", { className: "animate-in fade-in-0", children: /* @__PURE__ */ r("div", { className: s("bg-gray-200", "dark:bg-metal-700", "animate-pulse", "rounded", "h-5", "w-full") }) }) }, `skeleton-${l.id}`) : /* @__PURE__ */ r("td", { className: s("px-4", "py-1", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", "dark:[tr:last-child_&]:border-b", l.columnDef.meta?.className, {
-      "[tr:last-child_&:first-of-type]:rounded-bl-lg": a === e.length - 1 && o === 0,
-      "[tr:last-child_&:last-of-type]:rounded-br-lg": a === e.length - 1 && o === h.length - 1
-    }), children: /* @__PURE__ */ r(f, { variant: "link", shape: "circle", size: "large", disabled: !0, "aria-hidden": "true", children: /* @__PURE__ */ r(u, { className: s("w-5", "h-5", "text-slate-400", "dark:text-metal-700", {
-      "text-gray-300 animate-pulse": b || c
-    }) }) }) }, `skeleton-${l.id}`)) }, `skeleton-row-${a}`);
-  }) }), t[2] = e, t[3] = m, t[4] = b, t[5] = c, t[6] = i) : i = t[6], i;
+var N = ({ numberOfRows: i, table: o }) => {
+  const { tableFetching: n, tableLoading: b } = h(), t = Array.from({ length: i });
+  return /* @__PURE__ */ r("tbody", {
+    className: "text-slate-800 text-sm font-normal relative",
+    children: t.map((g, e) => {
+      const d = o.getAllColumns();
+      return /* @__PURE__ */ r("tr", {
+        className: l("border-b", "border-b-gray-200", "bg-transparent", "last:border-b-transparent"),
+        children: d.map((a, s) => a.id !== "actions" ? /* @__PURE__ */ r("td", {
+          className: l("px-4", "py-1", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", "dark:[tr:last-child_&]:border-b", a.columnDef.meta?.className, {
+            "[tr:last-child_&:first-of-type]:rounded-bl-lg": e === t.length - 1 && s === 0,
+            "[tr:last-child_&:last-of-type]:rounded-br-lg": e === t.length - 1 && s === d.length - 1
+          }),
+          children: /* @__PURE__ */ r("div", {
+            className: "animate-in fade-in-0",
+            children: /* @__PURE__ */ r("div", { className: l("bg-gray-200", "dark:bg-metal-700", "animate-pulse", "rounded", "h-5", "w-full") })
+          })
+        }, `skeleton-${a.id}`) : /* @__PURE__ */ r("td", {
+          className: l("px-4", "py-1", "bg-white", "dark:bg-metal-900", "dark:border-t", "dark:border-metal-700", "dark:first:border-l", "dark:last:border-r", "dark:[tr:last-child_&]:border-b", a.columnDef.meta?.className, {
+            "[tr:last-child_&:first-of-type]:rounded-bl-lg": e === t.length - 1 && s === 0,
+            "[tr:last-child_&:last-of-type]:rounded-br-lg": e === t.length - 1 && s === d.length - 1
+          }),
+          children: /* @__PURE__ */ r(m, {
+            variant: "link",
+            shape: "circle",
+            size: "large",
+            disabled: !0,
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ r(c, { className: l("w-5", "h-5", "text-slate-400", "dark:text-metal-700", { "text-gray-300 animate-pulse": n || b }) })
+          })
+        }, `skeleton-${a.id}`))
+      }, `skeleton-row-${e}`);
+    })
+  });
 };
 export {
-  E as Skeleton
+  N as Skeleton
 };