@deepnoid/ui 0.1.136 → 0.1.138

package/dist/{chunk-4URRLVNR.mjs → chunk-4JOD47VZ.mjs}

@@ -30,7 +30,7 @@ var Pagination = forwardRef((originalProps, ref) => {
     totalPage,
     showPageNumber = true,
     showPageLabel,
-    showFirstLastButtons,
+    showFirstLastButtons = true,
     handleChangePage,
     variant,
     size

package/dist/{chunk-IUNZZ77V.mjs → chunk-VRSRT4DM.mjs}

@@ -1,10 +1,7 @@
 "use client";
-import {
-  skeleton_default
-} from "./chunk-6PN3DGOE.mjs";
 import {
   pagination_default
-} from "./chunk-4URRLVNR.mjs";
+} from "./chunk-4JOD47VZ.mjs";
 import {
   scrollArea_default
 } from "./chunk-M37VBNB3.mjs";
@@ -29,7 +26,7 @@ import {
 import { tv } from "tailwind-variants";
 
 // src/components/table/table-body.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 var TableBody = ({
   slots,
   rows,
@@ -42,13 +39,9 @@ var TableBody = ({
   onRowClick,
   isLoading = false,
   emptyContent,
-  skeletonRow,
   classNames,
   className
 }) => {
-  const renderTdSkeleton = (key, column) => {
-    return /* @__PURE__ */ jsx("td", { className: slots.td({ class: classNames == null ? void 0 : classNames.td }), style: column ? getCellStyle(column) : {}, children: /* @__PURE__ */ jsx(skeleton_default, { color, className: "h-full w-full", rounded: "lg", speed: "fast" }) }, key);
-  };
   const renderCheckboxCell = (rowId, rowIndex) => /* @__PURE__ */ jsx(
     "td",
     {
@@ -58,10 +51,6 @@ var TableBody = ({
     },
     `checkbox-${rowId}-${rowIndex}`
   );
-  const renderSkeletonRow = (rowIndex) => /* @__PURE__ */ jsxs("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: [
-    columns.map((column, colIdx) => renderTdSkeleton(`skeleton-${rowIndex}-${colIdx}`, column)),
-    rowCheckbox && renderTdSkeleton(`skeleton-checkbox-${rowIndex}`)
-  ] }, `skeleton-${rowIndex}`);
   const renderEmptyRow = () => /* @__PURE__ */ jsx("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: /* @__PURE__ */ jsx("td", { colSpan: columns.length + (rowCheckbox ? 1 : 0), className: slots.empty({ class: classNames == null ? void 0 : classNames.empty }), children: emptyContent }) });
   const renderDataRow = (row, rowIndex) => /* @__PURE__ */ jsxs(
     "tr",
@@ -89,12 +78,18 @@ var TableBody = ({
     },
     `${row.id}-${rowIndex}`
   );
-  const renderRows = () => {
-    if (isLoading) return skeletonRow ? Array.from({ length: skeletonRow }, (_, idx) => renderSkeletonRow(idx)) : /* @__PURE__ */ jsx(Fragment, {});
-    if (!rows.length && emptyContent) return renderEmptyRow();
-    return rows.map((row, index) => renderDataRow(row, index));
-  };
-  return /* @__PURE__ */ jsx("tbody", { className: clsx(slots.tbody({ class: classNames == null ? void 0 : classNames.tbody }), className), children: renderRows() });
+  return /* @__PURE__ */ jsx(
+    "tbody",
+    {
+      className: clsx(
+        slots.tbody({ class: classNames == null ? void 0 : classNames.tbody }),
+        className,
+        "transition-all duration-200 ease-in-out",
+        isLoading && slots.tbodyLoading({ class: classNames == null ? void 0 : classNames.tbodyLoading })
+      ),
+      children: !rows.length && emptyContent ? renderEmptyRow() : rows.map((row, index) => renderDataRow(row, index))
+    }
+  );
 };
 var table_body_default = TableBody;
 
@@ -115,13 +110,12 @@ var Table = forwardRef((originalProps, ref) => {
     variant,
     color,
     size,
-    skeletonRow,
     checkedRows,
     onCheckedRowsChange,
     onRowClick
   } = { ...props, ...variantProps };
   const { page = 1, perPage = 15 } = pagination || {};
-  const showPagination = pagination && totalData > 0 && !isLoading;
+  const showPagination = pagination && totalData > 0;
   const [checkedRowIds, setCheckedRowIds] = useState(new Set(checkedRows == null ? void 0 : checkedRows.map((row) => row.id)));
   const tableMinWidth = useMemo(() => {
     const columnsWidth = columns.reduce((total, column) => {
@@ -194,7 +188,6 @@ var Table = forwardRef((originalProps, ref) => {
               rowCheckbox,
               hasCheckedRows: rows.length > 0 && rows.every((row) => checkedRowIds.has(row.id)),
               onCheckAll: handleAllRowCheck,
-              isLoading,
               classNames,
               slots
             }
@@ -213,14 +206,10 @@ var Table = forwardRef((originalProps, ref) => {
               onRowClick: handleRowClick,
               isLoading,
               emptyContent,
-              skeletonRow,
-              className: clsx(
-                "transition-all duration-150 ease-out",
-                isLoading ? "-translate-y-2 opacity-0" : "translate-y-0 opacity-100",
-                classNames
-              )
+              classNames
             }
-          )
+          ),
+          isLoading && /* @__PURE__ */ jsx2("div", { className: slots.overlay({ class: classNames == null ? void 0 : classNames.overlay }) })
         ]
       }
     ) }),
@@ -278,7 +267,9 @@ var tableStyle = tv({
       "[&>*]:z-1",
       "[&>*]:relative",
       "align-middle"
-    ]
+    ],
+    tbodyLoading: [],
+    overlay: []
   },
   variants: {
     variant: {
@@ -486,7 +477,6 @@ var TableHead = ({
   size,
   rowCheckbox = false,
   hasCheckedRows,
-  isLoading = false,
   classNames,
   onCheckAll
 }) => {
@@ -506,13 +496,7 @@ var TableHead = ({
     },
     key
   );
-  const renderSkeletonRow = () => /* @__PURE__ */ jsx3("thead", { className: slots.thead({ class: classNames == null ? void 0 : classNames.thead }), children: /* @__PURE__ */ jsxs3("tr", { className: clsx(slots.tr({ class: classNames == null ? void 0 : classNames.tr }), "[&>th]:border-0"), children: [
-    columns.map(
-      (column, idx) => renderTh(/* @__PURE__ */ jsx3(skeleton_default, { color, rounded: "lg", speed: "fast" }), `skeleton-${idx}`, column)
-    ),
-    rowCheckbox && renderTh(/* @__PURE__ */ jsx3(skeleton_default, { color, rounded: "lg", speed: "fast" }), "checkbox-skeleton", void 0, true)
-  ] }) });
-  const renderContentRow = () => /* @__PURE__ */ jsx3("thead", { className: slots.thead({ class: classNames == null ? void 0 : classNames.thead }), children: /* @__PURE__ */ jsxs3("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: [
+  return /* @__PURE__ */ jsx3("thead", { className: slots.thead({ class: classNames == null ? void 0 : classNames.thead }), children: /* @__PURE__ */ jsxs3("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: [
     columns.map((column, idx) => renderTh(column.headerName, `${column.field}-${idx}`, column)),
     rowCheckbox && renderTh(
       /* @__PURE__ */ jsx3("div", { "data-checkbox": true, children: /* @__PURE__ */ jsx3(
@@ -528,7 +512,6 @@ var TableHead = ({
       true
     )
   ] }) });
-  return isLoading ? renderSkeletonRow() : renderContentRow();
 };
 var table_head_default = TableHead;
 

package/dist/components/pagination/index.js

@@ -5535,7 +5535,7 @@ var Pagination = (0, import_react3.forwardRef)((originalProps, ref) => {
     totalPage,
     showPageNumber = true,
     showPageLabel,
-    showFirstLastButtons,
+    showFirstLastButtons = true,
     handleChangePage,
     variant,
     size

package/dist/components/pagination/index.mjs

@@ -2,7 +2,7 @@
 import "../../chunk-7B7LRG5J.mjs";
 import {
   pagination_default
-} from "../../chunk-4URRLVNR.mjs";
+} from "../../chunk-4JOD47VZ.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-2GCSFWHD.mjs";
 import "../../chunk-GL4E6YGW.mjs";

package/dist/components/pagination/pagination.js

@@ -5533,7 +5533,7 @@ var Pagination = (0, import_react3.forwardRef)((originalProps, ref) => {
     totalPage,
     showPageNumber = true,
     showPageLabel,
-    showFirstLastButtons,
+    showFirstLastButtons = true,
     handleChangePage,
     variant,
     size

package/dist/components/pagination/pagination.mjs

@@ -1,7 +1,7 @@
 "use client";
 import {
   pagination_default
-} from "../../chunk-4URRLVNR.mjs";
+} from "../../chunk-4JOD47VZ.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-2GCSFWHD.mjs";
 import "../../chunk-GL4E6YGW.mjs";

package/dist/components/table/index.d.mts

@@ -1,4 +1,4 @@
-export { default as Table, TableColumn, TableRef, TableRow } from './table.mjs';
+export { default as Table, TableColumn, TableProps, TableRef, TableRow } from './table.mjs';
 export { default as DefinitionTable, DefinitionTableRow, DefinitionTableRowCell } from './definition-table.mjs';
 import 'tailwind-variants';
 import 'react';

package/dist/components/table/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Table, TableColumn, TableRef, TableRow } from './table.js';
+export { default as Table, TableColumn, TableProps, TableRef, TableRow } from './table.js';
 export { default as DefinitionTable, DefinitionTableRow, DefinitionTableRowCell } from './definition-table.js';
 import 'tailwind-variants';
 import 'react';