@moontra/moonui-pro 2.3.4 → 2.3.5

package/dist/index.mjs

@@ -52264,7 +52264,7 @@ function DataTable({
     /* @__PURE__ */ jsxs("div", { className: "moonui-pro-datatable-toolbar flex items-center justify-between", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
         searchable && /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-          /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }) }),
           /* @__PURE__ */ jsx(
             MoonUIInputPro,
             {
@@ -52276,17 +52276,17 @@ function DataTable({
           )
         ] }),
         filterable && /* @__PURE__ */ jsxs(MoonUIButtonPro, { variant: "outline", size: "sm", children: [
-          /* @__PURE__ */ jsx(Filter, { className: "mr-2 h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(Filter, { className: "mr-2 h-4 w-4" }) }),
           "Filters"
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
         exportable && /* @__PURE__ */ jsxs(MoonUIButtonPro, { variant: "outline", size: "sm", onClick: handleExport, children: [
-          /* @__PURE__ */ jsx(Download, { className: "mr-2 h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(Download, { className: "mr-2 h-4 w-4" }) }),
           "Export"
         ] }),
         /* @__PURE__ */ jsxs(MoonUIButtonPro, { variant: "outline", size: "sm", children: [
-          /* @__PURE__ */ jsx(Settings, { className: "mr-2 h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(Settings, { className: "mr-2 h-4 w-4" }) }),
           "Columns"
         ] })
       ] })
@@ -52306,7 +52306,7 @@ function DataTable({
               onClick: header.column.getToggleSortingHandler(),
               children: [
                 flexRender(header.column.columnDef.header, header.getContext()),
-                header.column.getCanSort() && /* @__PURE__ */ jsx("div", { className: "ml-2", children: header.column.getIsSorted() === "asc" ? /* @__PURE__ */ jsx(ArrowUp, { className: "h-4 w-4" }) : header.column.getIsSorted() === "desc" ? /* @__PURE__ */ jsx(ArrowDown, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(ArrowUpDown, { className: "h-4 w-4" }) })
+                header.column.getCanSort() && /* @__PURE__ */ jsx("div", { className: "ml-2", children: header.column.getIsSorted() === "asc" ? /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ArrowUp, { className: "h-4 w-4" }) }) : header.column.getIsSorted() === "desc" ? /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ArrowDown, { className: "h-4 w-4" }) }) : /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ArrowUpDown, { className: "h-4 w-4" }) }) })
               ]
             }
           )
@@ -52321,7 +52321,7 @@ function DataTable({
           exit: { opacity: 0 },
           transition: { duration: 0.2 },
           children: /* @__PURE__ */ jsx("td", { colSpan: columns.length, className: "h-24 text-center", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center space-x-2", children: [
-            /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }),
+            /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }) }),
             /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Loading..." })
           ] }) })
         },
@@ -52425,7 +52425,7 @@ function DataTable({
                 }
               },
               disabled: !table.getCanPreviousPage() || isPaginationLoading,
-              children: /* @__PURE__ */ jsx(ChevronsLeft, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ChevronsLeft, { className: "h-4 w-4" }) })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -52445,7 +52445,7 @@ function DataTable({
                 }
               },
               disabled: !table.getCanPreviousPage() || isPaginationLoading,
-              children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" }) })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -52460,7 +52460,7 @@ function DataTable({
                 setIsPaginationLoading(false);
               },
               disabled: !table.getCanNextPage() || isPaginationLoading,
-              children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" }) })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -52475,7 +52475,7 @@ function DataTable({
                 setIsPaginationLoading(false);
               },
               disabled: !table.getCanNextPage() || isPaginationLoading,
-              children: /* @__PURE__ */ jsx(ChevronsRight, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: /* @__PURE__ */ jsx(ChevronsRight, { className: "h-4 w-4" }) })
             }
           )
         ] })
@@ -52500,7 +52500,7 @@ function getExpandableColumn(expandedRows, onToggle) {
           },
           className: "p-2 hover:bg-muted rounded-md transition-colors",
           "aria-label": isExpanded ? "Collapse row" : "Expand row",
-          children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 text-muted-foreground" })
+          children: /* @__PURE__ */ jsx("span", { suppressHydrationWarning: true, children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 text-muted-foreground" }) })
         }
       );
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moontra/moonui-pro",
-  "version": "2.3.4",
+  "version": "2.3.5",
   "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
   "type": "module",
   "main": "dist/index.mjs",
@@ -75,7 +75,7 @@
     "react-dom": ">=18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@moontra/moonui-pro": "^2.3.3",
+    "@moontra/moonui-pro": "^2.3.4",
     "@radix-ui/react-accordion": "^1.2.11",
     "@radix-ui/react-avatar": "^1.1.10",
     "@radix-ui/react-checkbox": "^1.3.2",

package/src/components/data-table/index.tsx

@@ -246,7 +246,9 @@ export function DataTable<TData, TValue>({
         <div className="flex items-center space-x-2">
           {searchable && (
             <div className="relative">
-              <Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
+              <span suppressHydrationWarning>
+                <Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
+              </span>
               <Input
                 placeholder={filterPlaceholder}
                 value={globalFilter}
@@ -258,7 +260,7 @@ export function DataTable<TData, TValue>({
           
           {filterable && (
             <Button variant="outline" size="sm">
-              <Filter className="mr-2 h-4 w-4" />
+              <span suppressHydrationWarning><Filter className="mr-2 h-4 w-4" /></span>
               Filters
             </Button>
           )}
@@ -267,13 +269,13 @@ export function DataTable<TData, TValue>({
         <div className="flex items-center space-x-2">
           {exportable && (
             <Button variant="outline" size="sm" onClick={handleExport}>
-              <Download className="mr-2 h-4 w-4" />
+              <span suppressHydrationWarning><Download className="mr-2 h-4 w-4" /></span>
               Export
             </Button>
           )}
           
           <Button variant="outline" size="sm">
-            <Settings className="mr-2 h-4 w-4" />
+            <span suppressHydrationWarning><Settings className="mr-2 h-4 w-4" /></span>
             Columns
           </Button>
         </div>
@@ -303,11 +305,11 @@ export function DataTable<TData, TValue>({
                         {header.column.getCanSort() && (
                           <div className="ml-2">
                             {header.column.getIsSorted() === 'asc' ? (
-                              <ArrowUp className="h-4 w-4" />
+                              <span suppressHydrationWarning><ArrowUp className="h-4 w-4" /></span>
                             ) : header.column.getIsSorted() === 'desc' ? (
-                              <ArrowDown className="h-4 w-4" />
+                              <span suppressHydrationWarning><ArrowDown className="h-4 w-4" /></span>
                             ) : (
-                              <ArrowUpDown className="h-4 w-4" />
+                              <span suppressHydrationWarning><ArrowUpDown className="h-4 w-4" /></span>
                             )}
                           </div>
                         )}
@@ -330,7 +332,7 @@ export function DataTable<TData, TValue>({
                 >
                   <td colSpan={columns.length} className="h-24 text-center">
                     <div className="flex items-center justify-center space-x-2">
-                      <Loader2 className="h-4 w-4 animate-spin" />
+                      <span suppressHydrationWarning><Loader2 className="h-4 w-4 animate-spin" /></span>
                       <span className="text-sm text-muted-foreground">Loading...</span>
                     </div>
                   </td>
@@ -455,7 +457,7 @@ export function DataTable<TData, TValue>({
                 }}
                 disabled={!table.getCanPreviousPage() || isPaginationLoading}
               >
-                <ChevronsLeft className="h-4 w-4" />
+                <span suppressHydrationWarning><ChevronsLeft className="h-4 w-4" /></span>
               </Button>
               <Button
                 variant="outline"
@@ -473,7 +475,7 @@ export function DataTable<TData, TValue>({
                 }}
                 disabled={!table.getCanPreviousPage() || isPaginationLoading}
               >
-                <ChevronLeft className="h-4 w-4" />
+                <span suppressHydrationWarning><ChevronLeft className="h-4 w-4" /></span>
               </Button>
               <Button
                 variant="outline"
@@ -486,7 +488,7 @@ export function DataTable<TData, TValue>({
                 }}
                 disabled={!table.getCanNextPage() || isPaginationLoading}
               >
-                <ChevronRight className="h-4 w-4" />
+                <span suppressHydrationWarning><ChevronRight className="h-4 w-4" /></span>
               </Button>
               <Button
                 variant="outline"
@@ -499,7 +501,7 @@ export function DataTable<TData, TValue>({
                 }}
                 disabled={!table.getCanNextPage() || isPaginationLoading}
               >
-                <ChevronsRight className="h-4 w-4" />
+                <span suppressHydrationWarning><ChevronsRight className="h-4 w-4" /></span>
               </Button>
             </div>
           </div>
@@ -536,11 +538,13 @@ export function getExpandableColumn<TData>(
           className="p-2 hover:bg-muted rounded-md transition-colors"
           aria-label={isExpanded ? "Collapse row" : "Expand row"}
         >
-          {isExpanded ? (
-            <ChevronDown className="h-4 w-4 text-muted-foreground" />
-          ) : (
-            <ChevronRight className="h-4 w-4 text-muted-foreground" />
-          )}
+          <span suppressHydrationWarning>
+            {isExpanded ? (
+              <ChevronDown className="h-4 w-4 text-muted-foreground" />
+            ) : (
+              <ChevronRight className="h-4 w-4 text-muted-foreground" />
+            )}
+          </span>
         </button>
       );
     },