@dappworks/kit 0.5.7 → 0.5.9

package/dist/{chunk-24SBSTZU.mjs → chunk-UNOD2CPN.mjs}

@@ -1,11 +1,11 @@
 import { PaginationState } from './chunk-ONVPCAMQ.mjs';
-import { SkeletonBox } from './chunk-QA3E2PJT.mjs';
+import { SkeletonBox } from './chunk-ELOEHZQA.mjs';
 import { _ } from './chunk-K7LFG5BA.mjs';
-import { cn } from './chunk-2HNXZE3X.mjs';
-import { __objRest, __spreadValues, __spreadProps } from './chunk-R4SQKVDQ.mjs';
+import { cn } from './chunk-5RDWJ3BR.mjs';
+import { __objRest, __spreadValues, __spreadProps } from './chunk-VIK2VI34.mjs';
 import * as React2 from 'react';
 import React2__default, { useRef, useEffect, useState, useMemo } from 'react';
-import { Pagination, Spinner, Card, Divider } from '@nextui-org/react';
+import { Card, Divider, Pagination, Spinner } from '@nextui-org/react';
 import { ChevronRight, Check, Circle, ChevronDown, ChevronUp, ChevronsUpDown, ChevronLeft } from 'lucide-react';
 import { observer } from 'mobx-react-lite';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
@@ -496,83 +496,77 @@ function SortingComponent({
     }
   ));
 }
-var CardUI = observer(({
-  className,
-  sortedData,
-  columns,
-  rowKey,
-  cardOptions,
-  onRowClick,
-  emptyContent,
-  columnSlot,
-  isServerPaging,
-  showPagination,
-  pagination,
-  nextuiPaginationProps,
-  autoScrollToTop
-}) => {
-  const cardBoxRef = useRef(null);
-  useEffect(() => {
-    if (!isServerPaging) {
-      pagination.setData({
-        total: sortedData.length
-      });
-    }
-  }, [sortedData]);
-  const data = isServerPaging || !showPagination ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);
-  const MyCard = ({ item }) => {
-    return /* @__PURE__ */ React2__default.createElement(
-      Card,
-      {
-        className: cn("mb-2 w-full shadow-sm p-4 rounded-lg", cardOptions == null ? void 0 : cardOptions.cardClassName),
-        isPressable: !!onRowClick,
-        onPress: () => {
-          onRowClick == null ? void 0 : onRowClick(item);
-        }
-      },
-      columns.map((column, i) => {
-        return /* @__PURE__ */ React2__default.createElement("div", { className: "w-full", key: column.key }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("w-full", cardOptions == null ? void 0 : cardOptions.itemClassName) }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("font-meidum text-xs text-foreground-400", cardOptions == null ? void 0 : cardOptions.labelClassName) }, column.label), /* @__PURE__ */ React2__default.createElement("div", { className: cn("text-xs", cardOptions == null ? void 0 : cardOptions.valueClassName) }, column.render ? column.render(item) : renderFieldValue(item[column.key]))), (cardOptions == null ? void 0 : cardOptions.showDivider) && i !== columns.length - 1 && /* @__PURE__ */ React2__default.createElement(Divider, { className: cn("my-2", cardOptions == null ? void 0 : cardOptions.dividerClassName) }));
-      }),
-      typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot
-    );
-  };
-  const GroupUI = () => {
-    const colSpan = (cardOptions == null ? void 0 : cardOptions.colSpan) || 1;
-    if (colSpan === 1) {
-      return data.map((item, index) => {
-        return /* @__PURE__ */ React2__default.createElement(MyCard, { key: rowKey ? item[rowKey] || index : index, item });
-      });
-    }
-    const groupData = groupByColSpan(data, colSpan);
-    return groupData.map((group, gIndex) => {
-      return /* @__PURE__ */ React2__default.createElement("div", { className: cn("flex items-center justify-between space-x-1", cardOptions == null ? void 0 : cardOptions.cardGroupClassName), key: gIndex }, group.map((item, index) => {
-        return /* @__PURE__ */ React2__default.createElement(MyCard, { key: rowKey ? item[rowKey] || index : index, item });
-      }));
-    });
-  };
-  return /* @__PURE__ */ React2__default.createElement("div", { className, ref: cardBoxRef }, sortedData.length > 0 ? /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement(GroupUI, null), showPagination && pagination.total > pagination.limit && /* @__PURE__ */ React2__default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React2__default.createElement(
-    Pagination,
-    __spreadValues({
-      className: "mt-2",
-      showControls: true,
-      showShadow: true,
-      size: "sm",
-      radius: "sm",
-      color: "primary",
-      initialPage: 1,
-      total: Math.ceil(pagination.total / pagination.limit),
-      page: pagination.page,
-      onChange: (currentPage) => {
+var CardUI = observer(
+  ({
+    className,
+    sortedData,
+    columns,
+    rowKey,
+    cardOptions,
+    onRowClick,
+    emptyContent,
+    columnSlot,
+    isServerPaging,
+    showPagination,
+    pagination,
+    nextuiPaginationProps,
+    autoScrollToTop
+  }) => {
+    const cardBoxRef = useRef(null);
+    pagination = pagination ? pagination : useRef(
+      new PaginationState({
+        page: 1,
+        limit: 10
+      })
+    ).current;
+    useEffect(() => {
+      if (!isServerPaging && pagination) {
         pagination.setData({
-          page: currentPage
+          total: sortedData.length
         });
-        if (autoScrollToTop && cardBoxRef.current) {
-          scrollIntoTop(cardBoxRef.current);
-        }
       }
-    }, nextuiPaginationProps)
-  ))) : emptyContent != null ? emptyContent : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null));
-});
+    }, [sortedData]);
+    const data = isServerPaging || !showPagination ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);
+    return /* @__PURE__ */ React2__default.createElement("div", { className, ref: cardBoxRef }, sortedData.length > 0 ? /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement("div", { className: cardOptions == null ? void 0 : cardOptions.cardContainerClassName }, data.map((item, index) => {
+      return /* @__PURE__ */ React2__default.createElement(
+        Card,
+        {
+          key: rowKey ? item[rowKey] || index : index,
+          className: cn("mb-2 w-full shadow-sm p-4 rounded-lg", cardOptions == null ? void 0 : cardOptions.cardClassName),
+          isPressable: !!onRowClick,
+          onPress: () => {
+            onRowClick == null ? void 0 : onRowClick(item);
+          }
+        },
+        columns.map((column, i) => {
+          return /* @__PURE__ */ React2__default.createElement("div", { className: "w-full", key: column.key }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("w-full", cardOptions == null ? void 0 : cardOptions.itemClassName) }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("font-meidum text-xs text-foreground-400", cardOptions == null ? void 0 : cardOptions.labelClassName) }, column.label), /* @__PURE__ */ React2__default.createElement("div", { className: cn("text-xs", cardOptions == null ? void 0 : cardOptions.valueClassName) }, column.render ? column.render(item) : renderFieldValue(item[column.key]))), (cardOptions == null ? void 0 : cardOptions.showDivider) && i !== columns.length - 1 && /* @__PURE__ */ React2__default.createElement(Divider, { className: cn("my-2", cardOptions == null ? void 0 : cardOptions.dividerClassName) }));
+        }),
+        typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot
+      );
+    })), showPagination && pagination.total > pagination.limit && /* @__PURE__ */ React2__default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React2__default.createElement(
+      Pagination,
+      __spreadValues({
+        className: "mt-2",
+        showControls: true,
+        showShadow: true,
+        size: "sm",
+        radius: "sm",
+        color: "primary",
+        initialPage: 1,
+        total: Math.ceil(pagination.total / pagination.limit),
+        page: pagination.page,
+        onChange: (currentPage) => {
+          pagination.setData({
+            page: currentPage
+          });
+          if (autoScrollToTop && cardBoxRef.current) {
+            scrollIntoTop(cardBoxRef.current);
+          }
+        }
+      }, nextuiPaginationProps)
+    ))) : emptyContent != null ? emptyContent : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null));
+  }
+);
 function VirtualizedCardUI({
   className,
   sortedData,
@@ -587,41 +581,47 @@ function VirtualizedCardUI({
   virtualizedOptions,
   columnSlot
 }) {
-  const colSpan = (cardOptions == null ? void 0 : cardOptions.colSpan) || 1;
+  var _a, _b;
+  const colSpan = ((_a = virtualizedOptions == null ? void 0 : virtualizedOptions.cardOptions) == null ? void 0 : _a.colSpan) || ((_b = cardOptions == null ? void 0 : cardOptions.virtualizedOptions) == null ? void 0 : _b.colSpan) || 1;
   const fetchedCountRef = useRef(-1);
-  const elements = useMemo(
-    () => {
-      const MyCard = ({ item }) => {
+  const elements = useMemo(() => {
+    const MyCard = ({ item }) => {
+      return /* @__PURE__ */ React2__default.createElement(
+        Card,
+        {
+          className: cn("mb-2 w-full shadow-sm p-4 rounded-lg", cardOptions == null ? void 0 : cardOptions.cardClassName),
+          isPressable: !!onRowClick,
+          onPress: () => {
+            onRowClick == null ? void 0 : onRowClick(item);
+          }
+        },
+        columns.map((column, i) => {
+          return /* @__PURE__ */ React2__default.createElement("div", { className: "w-full", key: column.key }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("w-full", cardOptions == null ? void 0 : cardOptions.itemClassName) }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("font-meidum text-xs text-foreground-400", cardOptions == null ? void 0 : cardOptions.labelClassName) }, column.label), /* @__PURE__ */ React2__default.createElement("div", { className: cn("text-xs", cardOptions == null ? void 0 : cardOptions.valueClassName) }, column.render ? column.render(item) : renderFieldValue(item[column.key]))), (cardOptions == null ? void 0 : cardOptions.showDivider) && i !== columns.length - 1 && /* @__PURE__ */ React2__default.createElement(Divider, { className: cn("my-2", cardOptions == null ? void 0 : cardOptions.dividerClassName) }));
+        }),
+        typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot
+      );
+    };
+    if (colSpan === 1) {
+      return sortedData.map((item, index) => {
+        return /* @__PURE__ */ React2__default.createElement(MyCard, { key: rowKey ? item[rowKey] || index : index, item });
+      });
+    } else {
+      const groupData = groupByColSpan(sortedData, colSpan);
+      return groupData.map((group, gIndex) => {
+        var _a2, _b2;
         return /* @__PURE__ */ React2__default.createElement(
-          Card,
+          "div",
           {
-            className: cn("mb-2 w-full shadow-sm p-4 rounded-lg", cardOptions == null ? void 0 : cardOptions.cardClassName),
-            isPressable: !!onRowClick,
-            onPress: () => {
-              onRowClick == null ? void 0 : onRowClick(item);
-            }
+            className: cn("flex items-center justify-between space-x-1", ((_a2 = virtualizedOptions == null ? void 0 : virtualizedOptions.cardOptions) == null ? void 0 : _a2.cardContainerClassName) || ((_b2 = cardOptions == null ? void 0 : cardOptions.virtualizedOptions) == null ? void 0 : _b2.cardContainerClassName)),
+            key: gIndex
           },
-          columns.map((column, i) => {
-            return /* @__PURE__ */ React2__default.createElement("div", { className: "w-full", key: column.key }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("w-full", cardOptions == null ? void 0 : cardOptions.itemClassName) }, /* @__PURE__ */ React2__default.createElement("div", { className: cn("font-meidum text-xs text-foreground-400", cardOptions == null ? void 0 : cardOptions.labelClassName) }, column.label), /* @__PURE__ */ React2__default.createElement("div", { className: cn("text-xs", cardOptions == null ? void 0 : cardOptions.valueClassName) }, column.render ? column.render(item) : renderFieldValue(item[column.key]))), (cardOptions == null ? void 0 : cardOptions.showDivider) && i !== columns.length - 1 && /* @__PURE__ */ React2__default.createElement(Divider, { className: cn("my-2", cardOptions == null ? void 0 : cardOptions.dividerClassName) }));
-          }),
-          typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot
-        );
-      };
-      if (colSpan === 1) {
-        return sortedData.map((item, index) => {
-          return /* @__PURE__ */ React2__default.createElement(MyCard, { key: rowKey ? item[rowKey] || index : index, item });
-        });
-      } else {
-        const groupData = groupByColSpan(sortedData, colSpan);
-        return groupData.map((group, gIndex) => {
-          return /* @__PURE__ */ React2__default.createElement("div", { className: cn("flex items-center justify-between space-x-1", cardOptions == null ? void 0 : cardOptions.cardGroupClassName), key: gIndex }, group.map((item, index) => {
+          group.map((item, index) => {
             return /* @__PURE__ */ React2__default.createElement(MyCard, { key: rowKey ? item[rowKey] || index : index, item });
-          }));
-        });
-      }
-    },
-    [sortedData]
-  );
+          })
+        );
+      });
+    }
+  }, [sortedData]);
   return /* @__PURE__ */ React2__default.createElement("div", { className }, sortedData.length > 0 ? /* @__PURE__ */ React2__default.createElement(
     VList,
     {
@@ -742,150 +742,141 @@ function VirtualizedListUI({
     isLoading ? loadingContent || DefaultLoading({ loadingOptions }) : null
   ) : emptyContent != null ? emptyContent : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null)));
 }
-var TableUI = observer(({
-  className,
-  classNames = {},
-  isHeaderSticky,
-  sortedData,
-  dataSource,
-  columns,
-  columnOptions,
-  sortableColumnsMap,
-  sortingUIOptions,
-  setSortableColumnsMap,
-  setSortedData,
-  isLoading,
-  loadingContent,
-  loadingOptions,
-  emptyContent,
-  rowCss,
-  onRowClick,
-  showCollapsedTables,
-  collapsedTableConfig,
-  collapsedTables,
-  rowKey,
-  isServerPaging,
-  showPagination,
-  pagination = new PaginationState({
-    page: 1,
-    limit: 10
-  }),
-  nextuiPaginationProps = {},
-  autoScrollToTop,
-  columnSlot
-}) => {
-  const tableBoxRef = useRef(null);
-  useEffect(() => {
-    if (!isServerPaging) {
-      pagination.setData({
-        total: dataSource.length
-      });
-    }
-  }, [dataSource]);
-  const data = isServerPaging || !showPagination ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);
-  return /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement("div", { className: cn("relative w-full", className), ref: tableBoxRef }, /* @__PURE__ */ React2__default.createElement("table", { className: cn("w-full h-auto table-auto", classNames.table) }, /* @__PURE__ */ React2__default.createElement("thead", { className: cn(classNames.thead, { "sticky top-0 z-30 [&>tr]:first:shadow-small [&>tr]:first:rounded-lg": isHeaderSticky }) }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, columns.map((item) => /* @__PURE__ */ React2__default.createElement(
-    "th",
-    {
-      key: item.key,
-      className: cn("px-3 h-10 text-xs font-semibold whitespace-nowrap bg-default-100 first:rounded-l-lg last:rounded-r-lg outline-none", classNames.th),
-      style: {
-        minWidth: item.width
-      }
-    },
-    /* @__PURE__ */ React2__default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React2__default.createElement("span", null, item.label), !!sortableColumnsMap[item.key] && /* @__PURE__ */ React2__default.createElement(
-      SortingComponent,
-      {
-        sortingUIOptions,
-        columnOptions,
-        sortableColumnsMap,
-        item,
-        onSort: ({ type, key, sortKey }) => {
-          const { sortableColumns, sortedData: sortedData2 } = sortData({
-            type,
-            key,
-            sortKey,
-            sortableColumnsMap,
-            dataSource
-          });
-          setSortableColumnsMap(sortableColumns);
-          setSortedData(sortedData2);
-        }
-      }
-    ))
-  ))), /* @__PURE__ */ React2__default.createElement("tr", { "aria-hidden": "true", className: "w-px h-px block ml-[0.25rem] mt-[0.25rem]" })), isLoading ? /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, /* @__PURE__ */ React2__default.createElement(
-    "td",
-    {
-      className: classNames.td,
-      colSpan: columns.length
-    },
-    loadingContent || DefaultLoading({ loadingOptions })
-  ))) : data.length > 0 ? /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, showCollapsedTables ? data.map((item) => {
-    return /* @__PURE__ */ React2__default.createElement(
-      CollapseBodyRow,
-      {
-        classNames,
-        item,
-        columns,
-        rowCss,
-        onRowClick,
-        collapsedTableConfig,
-        collapsedTables
+var TableUI = observer(
+  ({
+    className,
+    classNames = {},
+    isHeaderSticky,
+    sortedData,
+    dataSource,
+    columns,
+    columnOptions,
+    sortableColumnsMap,
+    sortingUIOptions,
+    setSortableColumnsMap,
+    setSortedData,
+    isLoading,
+    loadingContent,
+    loadingOptions,
+    emptyContent,
+    rowCss,
+    onRowClick,
+    showCollapsedTables,
+    collapsedTableConfig,
+    collapsedTables,
+    rowKey,
+    isServerPaging,
+    showPagination,
+    pagination,
+    nextuiPaginationProps = {},
+    autoScrollToTop,
+    columnSlot
+  }) => {
+    const tableBoxRef = useRef(null);
+    pagination = pagination ? pagination : useRef(
+      new PaginationState({
+        page: 1,
+        limit: 10
+      })
+    ).current;
+    useEffect(() => {
+      if (!isServerPaging) {
+        pagination.setData({
+          total: dataSource.length
+        });
       }
-    );
-  }) : data.map((item, index) => {
-    return /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement(
-      "tr",
+    }, [dataSource]);
+    const data = isServerPaging || !showPagination ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);
+    return /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement("div", { className: cn("relative w-full", className), ref: tableBoxRef }, /* @__PURE__ */ React2__default.createElement("table", { className: cn("w-full h-auto table-auto", classNames.table) }, /* @__PURE__ */ React2__default.createElement("thead", { className: cn(classNames.thead, { "sticky top-0 z-30 [&>tr]:first:shadow-small [&>tr]:first:rounded-lg": isHeaderSticky }) }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, columns.map((item) => /* @__PURE__ */ React2__default.createElement(
+      "th",
       {
-        key: rowKey ? item[rowKey] || index : index,
-        className: cn(classNames.tr, typeof rowCss === "function" ? rowCss(item) : rowCss),
-        onClick: () => {
-          onRowClick == null ? void 0 : onRowClick(item);
+        key: item.key,
+        className: cn("px-3 h-10 text-xs font-semibold whitespace-nowrap bg-default-100 first:rounded-l-lg last:rounded-r-lg outline-none", classNames.th),
+        style: {
+          minWidth: item.width
         }
       },
-      columns.map((column) => {
-        return /* @__PURE__ */ React2__default.createElement(
-          "td",
-          {
-            key: column.key,
-            className: cn("py-2 px-3 text-xs", classNames.td),
-            style: {
-              minWidth: column.width
-            }
-          },
-          column.render ? column.render(item) : renderFieldValue(item[column.key])
-        );
-      })
-    ), columnSlot && /* @__PURE__ */ React2__default.createElement("tr", null, /* @__PURE__ */ React2__default.createElement("td", { colSpan: columns.length }, typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot)));
-  })) : /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, /* @__PURE__ */ React2__default.createElement(
-    "td",
-    {
-      className: classNames.td,
-      colSpan: columns.length
-    },
-    emptyContent != null ? emptyContent : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null)
-  ))))), showPagination && pagination.total > pagination.limit && /* @__PURE__ */ React2__default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React2__default.createElement(
-    Pagination,
-    __spreadValues({
-      className: "mt-2",
-      showControls: true,
-      showShadow: true,
-      size: "sm",
-      radius: "sm",
-      color: "primary",
-      initialPage: 1,
-      total: Math.ceil(pagination.total / pagination.limit),
-      page: pagination.page,
-      onChange: (currentPage) => {
-        pagination.setData({
-          page: currentPage
-        });
-        if (autoScrollToTop && tableBoxRef.current) {
-          scrollIntoTop(tableBoxRef.current);
+      /* @__PURE__ */ React2__default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React2__default.createElement("span", null, item.label), !!sortableColumnsMap[item.key] && /* @__PURE__ */ React2__default.createElement(
+        SortingComponent,
+        {
+          sortingUIOptions,
+          columnOptions,
+          sortableColumnsMap,
+          item,
+          onSort: ({ type, key, sortKey }) => {
+            const { sortableColumns, sortedData: sortedData2 } = sortData({
+              type,
+              key,
+              sortKey,
+              sortableColumnsMap,
+              dataSource
+            });
+            setSortableColumnsMap(sortableColumns);
+            setSortedData(sortedData2);
+          }
         }
-      }
-    }, nextuiPaginationProps)
-  )));
-});
+      ))
+    ))), /* @__PURE__ */ React2__default.createElement("tr", { "aria-hidden": "true", className: "w-px h-px block ml-[0.25rem] mt-[0.25rem]" })), isLoading ? /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, /* @__PURE__ */ React2__default.createElement("td", { className: classNames.td, colSpan: columns.length }, loadingContent || DefaultLoading({ loadingOptions })))) : data.length > 0 ? /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, showCollapsedTables ? data.map((item) => {
+      return /* @__PURE__ */ React2__default.createElement(
+        CollapseBodyRow,
+        {
+          classNames,
+          item,
+          columns,
+          rowCss,
+          onRowClick,
+          collapsedTableConfig,
+          collapsedTables
+        }
+      );
+    }) : data.map((item, index) => {
+      return /* @__PURE__ */ React2__default.createElement(React2__default.Fragment, null, /* @__PURE__ */ React2__default.createElement(
+        "tr",
+        {
+          key: rowKey ? item[rowKey] || index : index,
+          className: cn(classNames.tr, typeof rowCss === "function" ? rowCss(item) : rowCss),
+          onClick: () => {
+            onRowClick == null ? void 0 : onRowClick(item);
+          }
+        },
+        columns.map((column) => {
+          return /* @__PURE__ */ React2__default.createElement(
+            "td",
+            {
+              key: column.key,
+              className: cn("py-2 px-3 text-xs", classNames.td),
+              style: {
+                minWidth: column.width
+              }
+            },
+            column.render ? column.render(item) : renderFieldValue(item[column.key])
+          );
+        })
+      ), columnSlot && /* @__PURE__ */ React2__default.createElement("tr", null, /* @__PURE__ */ React2__default.createElement("td", { colSpan: columns.length }, typeof columnSlot === "function" ? columnSlot({ row: item }) : columnSlot)));
+    })) : /* @__PURE__ */ React2__default.createElement("tbody", { className: classNames.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: classNames.tr }, /* @__PURE__ */ React2__default.createElement("td", { className: classNames.td, colSpan: columns.length }, emptyContent != null ? emptyContent : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null)))))), showPagination && pagination.total > pagination.limit && /* @__PURE__ */ React2__default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React2__default.createElement(
+      Pagination,
+      __spreadValues({
+        className: "mt-2",
+        showControls: true,
+        showShadow: true,
+        size: "sm",
+        radius: "sm",
+        color: "primary",
+        initialPage: 1,
+        total: Math.ceil(pagination.total / pagination.limit),
+        page: pagination.page,
+        onChange: (currentPage) => {
+          pagination.setData({
+            page: currentPage
+          });
+          if (autoScrollToTop && tableBoxRef.current) {
+            scrollIntoTop(tableBoxRef.current);
+          }
+        }
+      }, nextuiPaginationProps)
+    )));
+  }
+);
 function DefaultLoading({ loadingOptions }) {
   const type = (loadingOptions == null ? void 0 : loadingOptions.type) || "skeleton";
   const skeletonOptions = loadingOptions == null ? void 0 : loadingOptions.skeleton;
@@ -1024,14 +1015,7 @@ function CollapseBodyRow({
           );
         })
       );
-    })) : /* @__PURE__ */ React2__default.createElement("tbody", { className: (_e = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _e.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: (_f = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _f.tr }, /* @__PURE__ */ React2__default.createElement(
-      "td",
-      {
-        className: (_g = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _g.td,
-        colSpan: columns.length
-      },
-      (_h = collapsedTableConfig == null ? void 0 : collapsedTableConfig.emptyContent) != null ? _h : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null)
-    ))));
+    })) : /* @__PURE__ */ React2__default.createElement("tbody", { className: (_e = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _e.tbody }, /* @__PURE__ */ React2__default.createElement("tr", { className: (_f = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _f.tr }, /* @__PURE__ */ React2__default.createElement("td", { className: (_g = collapsedTableConfig == null ? void 0 : collapsedTableConfig.classNames) == null ? void 0 : _g.td, colSpan: columns.length }, (_h = collapsedTableConfig == null ? void 0 : collapsedTableConfig.emptyContent) != null ? _h : /* @__PURE__ */ React2__default.createElement(DefaultEmptyContent, null)))));
   }))));
 }
 function groupByColSpan(arr, colSpan) {
@@ -1044,4 +1028,4 @@ function groupByColSpan(arr, colSpan) {
 
 export { JSONTable };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-24SBSTZU.mjs.map
+//# sourceMappingURL=chunk-UNOD2CPN.mjs.map