@moontra/moonui-pro 2.3.1 → 2.3.2

package/dist/index.mjs

@@ -52153,9 +52153,6 @@ function FileUpload({
     ] })
   ] });
 }
-
-// src/components/data-table/data-table.css
-styleInject(".moonui-data-table-container {\n}\n.moonui-data-table-wrapper {\n}\n.moonui-data-table {\n  border-collapse: collapse;\n  table-layout: fixed;\n}\n.moonui-data-table-header {\n}\n.moonui-data-table-body {\n}\n.moonui-data-table-row {\n}\n.moonui-data-table-th {\n}\n.moonui-data-table-td {\n}\n.moonui-data-table-toolbar {\n}\n.moonui-data-table-container * {\n  box-sizing: border-box;\n}\n.moonui-data-table-container table {\n  margin: 0;\n  padding: 0;\n}\n.moonui-data-table-container th,\n.moonui-data-table-container td {\n  margin: 0;\n}\n");
 function DataTable({
   columns,
   data,
@@ -52246,8 +52243,8 @@ function DataTable({
       onExport(dataToExport);
     }
   };
-  return /* @__PURE__ */ jsxs("div", { className: cn("moonui-data-table-container space-y-4", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "moonui-data-table-toolbar flex items-center justify-between", children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("moonui-pro-datatable-container", className), style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+    /* @__PURE__ */ jsxs("div", { className: "moonui-pro-datatable-toolbar", style: { display: "flex", alignItems: "center", justifyContent: "space-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" }),
@@ -52277,7 +52274,7 @@ function DataTable({
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "moonui-data-table-wrapper rounded-md border overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "moonui-data-table w-full", children: [
+    /* @__PURE__ */ jsx("div", { className: "moonui-pro-datatable-wrapper rounded-md border overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "moonui-pro-datatable", style: { width: "100%" }, children: [
       /* @__PURE__ */ jsx("thead", { className: "moonui-data-table-header", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", { className: "moonui-data-table-row border-b", children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(
         "th",
         {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moontra/moonui-pro",
-  "version": "2.3.1",
+  "version": "2.3.2",
   "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",

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

@@ -1,7 +1,6 @@
 "use client"
 
 import React from 'react'
-import './data-table.css'
 import {
   useReactTable,
   getCoreRowModel,
@@ -208,9 +207,9 @@ export function DataTable<TData, TValue>({
   }
 
   return (
-    <div className={cn("moonui-data-table-container space-y-4", className)}>
+    <div className={cn("moonui-pro-datatable-container", className)} style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
       {/* Toolbar */}
-      <div className="moonui-data-table-toolbar flex items-center justify-between">
+      <div className="moonui-pro-datatable-toolbar" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
         <div className="flex items-center space-x-2">
           {searchable && (
             <div className="relative">
@@ -248,8 +247,8 @@ export function DataTable<TData, TValue>({
       </div>
 
       {/* Table */}
-      <div className="moonui-data-table-wrapper rounded-md border overflow-hidden">
-        <table className="moonui-data-table w-full">
+      <div className="moonui-pro-datatable-wrapper rounded-md border overflow-hidden">
+        <table className="moonui-pro-datatable" style={{ width: '100%' }}>
           <thead className="moonui-data-table-header">
             {table.getHeaderGroups().map((headerGroup) => (
               <tr key={headerGroup.id} className="moonui-data-table-row border-b">

package/src/components/data-table/data-table.css

@@ -1,54 +0,0 @@
-/* MoonUI DataTable Component Styles */
-.moonui-data-table-container {
-  /* Container specific styles */
-}
-
-.moonui-data-table-wrapper {
-  /* Wrapper specific styles */
-}
-
-.moonui-data-table {
-  /* Table specific styles */
-  border-collapse: collapse;
-  table-layout: fixed;
-}
-
-.moonui-data-table-header {
-  /* Header specific styles */
-}
-
-.moonui-data-table-body {
-  /* Body specific styles */
-}
-
-.moonui-data-table-row {
-  /* Row specific styles */
-}
-
-.moonui-data-table-th {
-  /* Table header cell specific styles */
-}
-
-.moonui-data-table-td {
-  /* Table data cell specific styles */
-}
-
-.moonui-data-table-toolbar {
-  /* Toolbar specific styles */
-}
-
-/* Prevent style leakage */
-.moonui-data-table-container * {
-  box-sizing: border-box;
-}
-
-/* Ensure DataTable styles don't affect global styles */
-.moonui-data-table-container table {
-  margin: 0;
-  padding: 0;
-}
-
-.moonui-data-table-container th,
-.moonui-data-table-container td {
-  margin: 0;
-}