@deepnoid/ui 0.0.98 → 0.0.100

package/dist/{chunk-B4KZBOGT.mjs → chunk-UZL66GNP.mjs}

@@ -19,7 +19,7 @@ var Pagination = forwardRef((originalProps, ref) => {
     currentPage,
     groupSize,
     totalPage,
-    showPageNumber,
+    showPageNumber = true,
     showPageLabel,
     showFirstLastButtons,
     handleChangePage
@@ -151,12 +151,19 @@ var pagination = tv(
         secondary: {
           label: "text-secondary-main"
         }
+      },
+      isDisabled: {
+        true: {
+          icon: "!text-neutral-light !cursor-default",
+          button: "!text-neutral-light !cursor-default"
+        }
       }
     },
     defaultVariants: {
       variant: "solid",
       color: "primary",
-      size: "md"
+      size: "md",
+      isDisabled: false
     },
     compoundVariants: [
       {

package/dist/{chunk-PNFR2J4Q.mjs → chunk-YVBOTJAH.mjs}

@@ -18,7 +18,7 @@ import { tv } from "tailwind-variants";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Table = forwardRef((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, table.variantKeys);
-  const { classNames, rows, columns, isLoading, className, emptyContent, onRowAction, ...tableComponentsProps } = props;
+  const { classNames, rows, columns, className, emptyContent, loadingContent, onRowAction, ...tableComponentsProps } = props;
   const [checkedRows, setCheckedRows] = useState(/* @__PURE__ */ new Set());
   const [selectedRows, setSelectedRows] = useState(/* @__PURE__ */ new Set());
   useEffect(() => {
@@ -38,10 +38,17 @@ var Table = forwardRef((originalProps, ref) => {
   const getTableProps = useCallback(
     (props2) => ({
       ...props2,
-      className: slots.table({ class: clsx(classNames == null ? void 0 : classNames.table, className) })
+      className: slots.table({ class: clsx(classNames == null ? void 0 : classNames.table) })
     }),
     [classNames == null ? void 0 : classNames.table, slots]
   );
+  const getLoadingWrapperProps = useCallback(
+    (props2) => ({
+      ...props2,
+      className: slots.loadingWrapper({ class: clsx(classNames == null ? void 0 : classNames.loadingWrapper) })
+    }),
+    [classNames == null ? void 0 : classNames.loadingWrapper, slots]
+  );
   const handleCheckAll = (isChecked) => {
     const newCheckedRows = isChecked ? new Set(rows.map((_, index) => index)) : /* @__PURE__ */ new Set();
     setCheckedRows(newCheckedRows);
@@ -79,53 +86,55 @@ var Table = forwardRef((originalProps, ref) => {
     setCheckedRows,
     setSelectedRows
   }));
-  return /* @__PURE__ */ jsx("div", { ref, "data-table": "base", ...getBaseProps(), children: /* @__PURE__ */ jsxs("table", { ...getTableProps(tableComponentsProps), children: [
-    /* @__PURE__ */ jsx(
-      table_head_default,
-      {
-        classNames,
-        slots,
-        columns,
-        size: originalProps.size,
-        color: originalProps.color === "neutral" ? "primary" : originalProps.color,
-        isChecked: originalProps.isChecked,
-        isExpanded: originalProps.isExpanded,
-        onCheckAll: handleCheckAll,
-        isCheckedAll: checkedRows.size === rows.length
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      table_body_default,
-      {
-        rows,
-        columns,
-        slots,
-        size: originalProps.size,
-        color: originalProps.color === "neutral" ? "primary" : originalProps.color,
-        isSelected: originalProps.isSelected,
-        isChecked: originalProps.isChecked,
-        isCheckedRow: originalProps.isCheckedRow,
-        isExpanded: originalProps.isExpanded,
-        isLoading,
-        classNames,
-        emptyContent,
-        selectedRows,
-        checkedRows,
-        onCheckedRow: handleCheckRow,
-        onSelectedRow: handleSelectRow,
-        onRowAction
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ jsxs("div", { ref, "data-table": "base", ...getBaseProps(), children: [
+    /* @__PURE__ */ jsxs("table", { ...getTableProps(tableComponentsProps), children: [
+      /* @__PURE__ */ jsx(
+        table_head_default,
+        {
+          classNames,
+          slots,
+          columns,
+          size: originalProps.size,
+          color: originalProps.color === "neutral" ? "primary" : originalProps.color,
+          isChecked: originalProps.isChecked,
+          isExpanded: originalProps.isExpanded,
+          onCheckAll: handleCheckAll,
+          isCheckedAll: checkedRows.size === rows.length
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        table_body_default,
+        {
+          rows,
+          columns,
+          slots,
+          size: originalProps.size,
+          color: originalProps.color === "neutral" ? "primary" : originalProps.color,
+          isSelected: originalProps.isSelected,
+          isChecked: originalProps.isChecked,
+          isCheckedRow: originalProps.isCheckedRow,
+          isExpanded: originalProps.isExpanded,
+          classNames,
+          emptyContent,
+          selectedRows,
+          checkedRows,
+          onCheckedRow: handleCheckRow,
+          onSelectedRow: handleSelectRow,
+          onRowAction
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { ...getLoadingWrapperProps(), children: loadingContent || "Loading..." })
+  ] });
 });
 Table.displayName = "Table";
 var table_default = Table;
 var table = tv({
   slots: {
-    base: "flex flex-col relative gap-4",
+    base: "flex flex-col relative gap-4 select-none",
     table: "w-full h-auto",
     thead: "[&>tr]:first:rounded-lg",
-    tbody: "w-full",
+    tbody: "",
     tr: ["group", "outline-none", "w-full"],
     th: [
       "text-foreground",
@@ -164,7 +173,18 @@ var table = tv({
       "data-[direction=ascending]:rotate-180"
     ],
     emptyWrapper: "text-neutral-light align-middle text-center h-40",
-    loadingWrapper: "absolute inset-0 flex items-center justify-center"
+    loadingWrapper: [
+      "absolute",
+      "inset-0",
+      "flex",
+      "items-center",
+      "justify-center",
+      "bg-black/40",
+      "text-white",
+      "transition-opacity",
+      "duration-200",
+      "ease-in-out"
+    ]
   },
   variants: {
     variant: {
@@ -210,6 +230,14 @@ var table = tv({
         expandedTr: "border-trans-light"
       }
     },
+    isLoading: {
+      true: {
+        loadingWrapper: "visible opacity-100"
+      },
+      false: {
+        loadingWrapper: "invisible opacity-0"
+      }
+    },
     isSelected: {
       true: {}
     },

package/dist/components/pagination/index.js

@@ -101,7 +101,7 @@ var Pagination = (0, import_react2.forwardRef)((originalProps, ref) => {
     currentPage,
     groupSize,
     totalPage,
-    showPageNumber,
+    showPageNumber = true,
     showPageLabel,
     showFirstLastButtons,
     handleChangePage
@@ -233,12 +233,19 @@ var pagination = tv(
         secondary: {
           label: "text-secondary-main"
         }
+      },
+      isDisabled: {
+        true: {
+          icon: "!text-neutral-light !cursor-default",
+          button: "!text-neutral-light !cursor-default"
+        }
       }
     },
     defaultVariants: {
       variant: "solid",
       color: "primary",
-      size: "md"
+      size: "md",
+      isDisabled: false
     },
     compoundVariants: [
       {

package/dist/components/pagination/index.mjs

@@ -2,7 +2,7 @@
 import "../../chunk-7B7LRG5J.mjs";
 import {
   pagination_default
-} from "../../chunk-B4KZBOGT.mjs";
+} from "../../chunk-UZL66GNP.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-J725QONZ.mjs";

package/dist/components/pagination/pagination.d.mts

@@ -57,6 +57,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;
@@ -125,6 +131,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;
@@ -171,6 +183,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;

package/dist/components/pagination/pagination.d.ts

@@ -57,6 +57,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;
@@ -125,6 +131,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;
@@ -171,6 +183,12 @@ declare const pagination: tailwind_variants.TVReturnType<{
             label: string;
         };
     };
+    isDisabled: {
+        true: {
+            icon: string;
+            button: string;
+        };
+    };
 }, {
     base: string;
     label: string;

package/dist/components/pagination/pagination.js

@@ -101,7 +101,7 @@ var Pagination = (0, import_react2.forwardRef)((originalProps, ref) => {
     currentPage,
     groupSize,
     totalPage,
-    showPageNumber,
+    showPageNumber = true,
     showPageLabel,
     showFirstLastButtons,
     handleChangePage
@@ -233,12 +233,19 @@ var pagination = tv(
         secondary: {
           label: "text-secondary-main"
         }
+      },
+      isDisabled: {
+        true: {
+          icon: "!text-neutral-light !cursor-default",
+          button: "!text-neutral-light !cursor-default"
+        }
       }
     },
     defaultVariants: {
       variant: "solid",
       color: "primary",
-      size: "md"
+      size: "md",
+      isDisabled: false
     },
     compoundVariants: [
       {

package/dist/components/pagination/pagination.mjs

@@ -3,7 +3,7 @@ import {
   Pagination,
   pagination,
   pagination_default
-} from "../../chunk-B4KZBOGT.mjs";
+} from "../../chunk-UZL66GNP.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-J725QONZ.mjs";

package/dist/components/pagination/pagination.test.js

@@ -12946,7 +12946,7 @@ var Pagination = (0, import_react2.forwardRef)((originalProps, ref) => {
     currentPage,
     groupSize,
     totalPage,
-    showPageNumber,
+    showPageNumber = true,
     showPageLabel,
     showFirstLastButtons,
     handleChangePage
@@ -13078,12 +13078,19 @@ var pagination = tv(
         secondary: {
           label: "text-secondary-main"
         }
+      },
+      isDisabled: {
+        true: {
+          icon: "!text-neutral-light !cursor-default",
+          button: "!text-neutral-light !cursor-default"
+        }
       }
     },
     defaultVariants: {
       variant: "solid",
       color: "primary",
-      size: "md"
+      size: "md",
+      isDisabled: false
     },
     compoundVariants: [
       {

package/dist/components/pagination/pagination.test.mjs

@@ -1,7 +1,7 @@
 "use client";
 import {
   pagination_default
-} from "../../chunk-B4KZBOGT.mjs";
+} from "../../chunk-UZL66GNP.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import {
   render

package/dist/components/table/index.js

@@ -4052,7 +4052,7 @@ var import_tailwind_variants3 = require("tailwind-variants");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, table.variantKeys);
-  const { classNames, rows, columns, isLoading, className, emptyContent, onRowAction, ...tableComponentsProps } = props;
+  const { classNames, rows, columns, className, emptyContent, loadingContent, onRowAction, ...tableComponentsProps } = props;
   const [checkedRows, setCheckedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
   const [selectedRows, setSelectedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
   (0, import_react6.useEffect)(() => {
@@ -4072,10 +4072,17 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
   const getTableProps = (0, import_react6.useCallback)(
     (props2) => ({
       ...props2,
-      className: slots.table({ class: clsx(classNames == null ? void 0 : classNames.table, className) })
+      className: slots.table({ class: clsx(classNames == null ? void 0 : classNames.table) })
     }),
     [classNames == null ? void 0 : classNames.table, slots]
   );
+  const getLoadingWrapperProps = (0, import_react6.useCallback)(
+    (props2) => ({
+      ...props2,
+      className: slots.loadingWrapper({ class: clsx(classNames == null ? void 0 : classNames.loadingWrapper) })
+    }),
+    [classNames == null ? void 0 : classNames.loadingWrapper, slots]
+  );
   const handleCheckAll = (isChecked) => {
     const newCheckedRows = isChecked ? new Set(rows.map((_, index) => index)) : /* @__PURE__ */ new Set();
     setCheckedRows(newCheckedRows);
@@ -4113,53 +4120,55 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
     setCheckedRows,
     setSelectedRows
   }));
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ref, "data-table": "base", ...getBaseProps(), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("table", { ...getTableProps(tableComponentsProps), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      table_head_default,
-      {
-        classNames,
-        slots,
-        columns,
-        size: originalProps.size,
-        color: originalProps.color === "neutral" ? "primary" : originalProps.color,
-        isChecked: originalProps.isChecked,
-        isExpanded: originalProps.isExpanded,
-        onCheckAll: handleCheckAll,
-        isCheckedAll: checkedRows.size === rows.length
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      table_body_default,
-      {
-        rows,
-        columns,
-        slots,
-        size: originalProps.size,
-        color: originalProps.color === "neutral" ? "primary" : originalProps.color,
-        isSelected: originalProps.isSelected,
-        isChecked: originalProps.isChecked,
-        isCheckedRow: originalProps.isCheckedRow,
-        isExpanded: originalProps.isExpanded,
-        isLoading,
-        classNames,
-        emptyContent,
-        selectedRows,
-        checkedRows,
-        onCheckedRow: handleCheckRow,
-        onSelectedRow: handleSelectRow,
-        onRowAction
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { ref, "data-table": "base", ...getBaseProps(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("table", { ...getTableProps(tableComponentsProps), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        table_head_default,
+        {
+          classNames,
+          slots,
+          columns,
+          size: originalProps.size,
+          color: originalProps.color === "neutral" ? "primary" : originalProps.color,
+          isChecked: originalProps.isChecked,
+          isExpanded: originalProps.isExpanded,
+          onCheckAll: handleCheckAll,
+          isCheckedAll: checkedRows.size === rows.length
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        table_body_default,
+        {
+          rows,
+          columns,
+          slots,
+          size: originalProps.size,
+          color: originalProps.color === "neutral" ? "primary" : originalProps.color,
+          isSelected: originalProps.isSelected,
+          isChecked: originalProps.isChecked,
+          isCheckedRow: originalProps.isCheckedRow,
+          isExpanded: originalProps.isExpanded,
+          classNames,
+          emptyContent,
+          selectedRows,
+          checkedRows,
+          onCheckedRow: handleCheckRow,
+          onSelectedRow: handleSelectRow,
+          onRowAction
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ...getLoadingWrapperProps(), children: loadingContent || "Loading..." })
+  ] });
 });
 Table.displayName = "Table";
 var table_default = Table;
 var table = (0, import_tailwind_variants3.tv)({
   slots: {
-    base: "flex flex-col relative gap-4",
+    base: "flex flex-col relative gap-4 select-none",
     table: "w-full h-auto",
     thead: "[&>tr]:first:rounded-lg",
-    tbody: "w-full",
+    tbody: "",
     tr: ["group", "outline-none", "w-full"],
     th: [
       "text-foreground",
@@ -4198,7 +4207,18 @@ var table = (0, import_tailwind_variants3.tv)({
       "data-[direction=ascending]:rotate-180"
     ],
     emptyWrapper: "text-neutral-light align-middle text-center h-40",
-    loadingWrapper: "absolute inset-0 flex items-center justify-center"
+    loadingWrapper: [
+      "absolute",
+      "inset-0",
+      "flex",
+      "items-center",
+      "justify-center",
+      "bg-black/40",
+      "text-white",
+      "transition-opacity",
+      "duration-200",
+      "ease-in-out"
+    ]
   },
   variants: {
     variant: {
@@ -4244,6 +4264,14 @@ var table = (0, import_tailwind_variants3.tv)({
         expandedTr: "border-trans-light"
       }
     },
+    isLoading: {
+      true: {
+        loadingWrapper: "visible opacity-100"
+      },
+      false: {
+        loadingWrapper: "invisible opacity-0"
+      }
+    },
     isSelected: {
       true: {}
     },

package/dist/components/table/index.mjs

@@ -2,7 +2,7 @@
 import "../../chunk-2UUH2MBF.mjs";
 import {
   table_default
-} from "../../chunk-PNFR2J4Q.mjs";
+} from "../../chunk-YVBOTJAH.mjs";
 import "../../chunk-QDDEQY63.mjs";
 import "../../chunk-PO3ADNA5.mjs";
 import "../../chunk-QZ3LVYJW.mjs";

package/dist/components/table/table-body.d.mts

@@ -12,7 +12,6 @@ type TableBodyProps = {
     slots: TableReturnType;
     rows: TableRow[];
     columns: TableColumn[];
-    isLoading?: boolean;
     isExpanded?: boolean;
     isSelected?: boolean;
     isChecked?: boolean;

package/dist/components/table/table-body.d.ts

@@ -12,7 +12,6 @@ type TableBodyProps = {
     slots: TableReturnType;
     rows: TableRow[];
     columns: TableColumn[];
-    isLoading?: boolean;
     isExpanded?: boolean;
     isSelected?: boolean;
     isChecked?: boolean;