@konstructio/ui 0.1.2-alpha.7 → 0.1.2-alpha.9

package/dist/components/VirtualizedTable/VirtualizedTable.js

@@ -1,99 +1,113 @@
 import { jsx as r, jsxs as m } from "react/jsx-runtime";
-import { useMemo as V } from "react";
-import { cn as g } from "../../utils/index.js";
-import { TableProvider as j } from "./contexts/table.provider.js";
-import { Filter as w } from "./components/Filter/Filter.js";
-import { Header as y } from "./components/Header/Header.js";
-import { Body as B } from "./components/Body/Body.js";
-import { Pagination as H } from "./components/Pagination/Pagination.js";
-import { TruncateText as K } from "./components/TruncateText/TruncateText.js";
-import { Actions as M } from "./components/Actions/Actions.js";
-const P = ({
-  id: s,
-  ariaLabel: c,
+import { useMemo as w } from "react";
+import { cn as s } from "../../utils/index.js";
+import { TableProvider as B } from "./contexts/table.provider.js";
+import { Filter as H } from "./components/Filter/Filter.js";
+import { Header as I } from "./components/Header/Header.js";
+import { Body as K } from "./components/Body/Body.js";
+import { Pagination as M } from "./components/Pagination/Pagination.js";
+import { TruncateText as P } from "./components/TruncateText/TruncateText.js";
+import { Actions as k } from "./components/Actions/Actions.js";
+const q = ({
+  id: c,
+  ariaLabel: n,
   columns: d,
-  data: n,
-  totalItems: f,
-  classNameHeaderTable: p,
-  classNameHeaderArrows: u,
+  data: f,
+  totalItems: p = -1 / 0,
+  className: u,
   classNameHeaderActiveArrows: b,
-  fetchData: T,
+  classNameHeaderArrows: T,
+  classNameHeaderTable: N,
+  classNameTable: h,
+  classNameWrapperTable: x,
+  fetchData: A,
   // Pagination
-  showPagination: N,
+  showPagination: v,
   showTotalItems: o,
-  showDropdownPagination: l,
-  showDotPagination: a,
-  showFormPagination: i,
-  pageSizes: h,
+  showDropdownPagination: i,
+  showDotPagination: l,
+  showFormPagination: a,
+  pageSizes: y,
   // Filter
-  showFilter: x = !1,
-  showFilterInput: A,
-  filterSearchPlaceholder: v = "",
-  multiSelectFilter: z
+  showFilter: z = !1,
+  showFilterInput: V,
+  filterSearchPlaceholder: g = "",
+  multiSelectFilter: j
 }) => {
-  const t = V(
-    () => N || [
+  const t = w(
+    () => v || [
       o,
+      i,
       l,
-      a,
-      i
+      a
     ].some(Boolean),
     []
   );
   return /* @__PURE__ */ r(
-    j,
+    B,
     {
-      id: s,
+      id: c,
       columns: d,
-      data: n,
-      fetchData: T,
-      totalItems: f,
-      children: /* @__PURE__ */ m("section", { children: [
-        x && /* @__PURE__ */ r(
-          w,
+      data: f,
+      fetchData: A,
+      totalItems: p,
+      children: /* @__PURE__ */ m("section", { className: u, children: [
+        z && /* @__PURE__ */ r(
+          H,
           {
-            placeholder: v,
-            multiSelectFilter: z,
-            showFilterInput: A
+            placeholder: g,
+            multiSelectFilter: j,
+            showFilterInput: V
           }
         ),
         /* @__PURE__ */ r(
           "div",
           {
-            className: g("shadow rounded-t-lg", {
-              "overflow-hidden rounded-lg": !t
-            }),
-            children: /* @__PURE__ */ m("table", { className: "w-full border-collapse", "aria-label": c, children: [
-              /* @__PURE__ */ r(
-                y,
-                {
-                  className: p,
-                  classNameArrows: u,
-                  classNameActiveArrows: b
-                }
-              ),
-              /* @__PURE__ */ r(B, {})
-            ] })
+            className: s(
+              "shadow rounded-t-lg",
+              {
+                "overflow-hidden rounded-lg": !t
+              },
+              x
+            ),
+            children: /* @__PURE__ */ m(
+              "table",
+              {
+                className: s("w-full border-collapse", h),
+                "aria-label": n,
+                children: [
+                  /* @__PURE__ */ r(
+                    I,
+                    {
+                      className: N,
+                      classNameArrows: T,
+                      classNameActiveArrows: b
+                    }
+                  ),
+                  /* @__PURE__ */ r(K, {})
+                ]
+              }
+            )
           }
         ),
         t && /* @__PURE__ */ r(
-          H,
+          M,
           {
             showTotalItems: o,
-            showDropdownPagination: l,
-            showDotPagination: a,
-            showFormPagination: i,
-            pageSizes: h
+            showDropdownPagination: i,
+            showDotPagination: l,
+            showFormPagination: a,
+            pageSizes: y
           }
         )
       ] })
     }
   );
-}, e = P;
+}, e = q;
 e.displayName = "KonstructVirtualizedTable";
-e.TruncateText = K;
-e.Actions = M;
+e.TruncateText = P;
+e.Actions = k;
 export {
-  K as TruncateText,
+  P as TruncateText,
   e as VirtualizedTable
 };

package/dist/components/VirtualizedTable/contexts/table.provider.js

@@ -1,49 +1,49 @@
 import { jsx as z } from "react/jsx-runtime";
 import { useQuery as E } from "@tanstack/react-query";
 import { u as _, g as j, a as k } from "../../../index-Dx2grAuN.js";
-import { useState as t, useMemo as q, useCallback as s } from "react";
+import { useState as t, useMemo as q, useCallback as n } from "react";
 import { TableContext as A } from "./table.context.js";
 import { DEFAULT_PAGE_SIZE as K } from "../constants/pagination.js";
 const Z = ({
-  children: u,
-  id: d,
+  children: d,
+  id: u,
   data: S = [],
   columns: f = [],
   totalItems: h,
   fetchData: p
 }) => {
-  const [i, g] = t([]), [n, m] = t(0), [r, C] = t(), [o, M] = t(K), [c, b] = t(h), P = q(
-    () => Math.ceil(c / o),
-    [c, o]
+  const [i, g] = t([]), [r, m] = t(0), [c, M] = t(), [o, C] = t(K), [l, b] = t(h), P = q(
+    () => Math.ceil(l / o),
+    [l, o]
   ), [a, w] = t({}), { data: y, isLoading: O, isFetching: T } = E({
     queryKey: [
-      d,
-      n,
-      o,
+      u,
       r,
+      o,
+      c,
       JSON.stringify(a)
     ],
     refetchOnMount: !1,
     refetchOnWindowFocus: !1,
     initialData: S,
     queryFn: () => p({
-      page: Math.max(n + 1, 1),
+      page: Math.max(r + 1, 1),
       pageSize: o,
-      termOfSearch: r,
+      termOfSearch: c,
       ...Object.keys(a).length > 0 ? a : {}
-    }).then(({ data: e, totalItemsCount: l }) => (b(l), e))
-  }), F = s((e) => {
-    C(e), m(0);
-  }, []), I = s((e, l) => {
+    }).then(({ data: e, totalItemsCount: s }) => (s && b(s), e))
+  }), F = n((e) => {
+    M(e), m(0);
+  }, []), R = n((e, s) => {
     const L = e.toLowerCase().replace(/\s+/g, "_");
     w((v) => ({
       ...v,
-      [L]: l
+      [L]: s
     }));
-  }, []), R = s((e) => m(e), []), x = s(
-    (e) => M(e),
+  }, []), x = n((e) => m(e), []), D = n(
+    (e) => C(e),
     []
-  ), D = _({
+  ), I = _({
     data: y,
     columns: f,
     state: {
@@ -58,22 +58,22 @@ const Z = ({
     {
       value: {
         sortedData: i,
-        table: D,
+        table: I,
         tableFetching: T,
         tableLoading: O,
-        totalItems: c,
-        termOfSearch: r,
-        page: n,
+        totalItems: l,
+        termOfSearch: c,
+        page: r,
         multiselectSelected: a,
         pageSize: o,
         totalPages: P,
-        handlePage: R,
-        onPageSize: x,
+        handlePage: x,
+        onPageSize: D,
         onChangeTermOfSearch: F,
         onSorting: g,
-        onSelectMultiselect: I
+        onSelectMultiselect: R
       },
-      children: u
+      children: d
     }
   );
 };

package/dist/index.d.ts

@@ -571,14 +571,16 @@ declare type Props_4<TData extends RowData_2> = VariantProps<typeof virtualizeTa
     ariaLabel?: string;
     columns: ColumnDef<TData, string>[];
     data: TData[];
-    totalItems: number;
+    className?: string;
+    classNameHeaderActiveArrows?: string;
+    classNameHeaderArrows?: string;
+    classNameHeaderTable?: string;
+    classNameTable?: string;
+    classNameWrapperTable?: string;
     fetchData: (params: Record<string, string | number | string[] | number[] | undefined>) => Promise<{
         data: TData[];
-        totalItemsCount: number;
+        totalItemsCount?: number;
     }>;
-    classNameHeaderTable?: string;
-    classNameHeaderArrows?: string;
-    classNameHeaderActiveArrows?: string;
 } & ({
     showPagination: true;
     showTotalItems?: boolean;
@@ -586,6 +588,7 @@ declare type Props_4<TData extends RowData_2> = VariantProps<typeof virtualizeTa
     showDotPagination?: boolean;
     showFormPagination?: boolean;
     pageSizes?: number[] | string[];
+    totalItems: number;
 } | {
     showPagination?: false | undefined;
     showTotalItems?: never;
@@ -593,6 +596,7 @@ declare type Props_4<TData extends RowData_2> = VariantProps<typeof virtualizeTa
     showDotPagination?: never;
     showFormPagination?: never;
     pageSizes?: never;
+    totalItems?: never;
 }) & ({
     filterSearchPlaceholder?: string;
     multiSelectFilter?: MultiSelectFilter[];

package/dist/package.json

@@ -2,7 +2,7 @@
   "name": "@konstructio/ui",
   "description": "A set of reusable and customizable React components built for konstruct.io",
   "private": false,
-  "version": "0.1.2-alpha.6",
+  "version": "0.1.2-alpha.8",
   "type": "module",
   "license": "MIT",
   "main": "dist/index.js",

package/package.json

@@ -2,7 +2,7 @@
   "name": "@konstructio/ui",
   "description": "A set of reusable and customizable React components built for konstruct.io",
   "private": false,
-  "version": "0.1.2-alpha.7",
+  "version": "0.1.2-alpha.9",
   "type": "module",
   "license": "MIT",
   "main": "dist/index.js",