react-live-data-table 1.0.8 → 1.0.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-live-data-table",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "Your React component package with Tailwind",
   "main": "src/index.js",
   "module": "dist/index.esm.js",

package/src/ReactDataTable.jsx

@@ -15,14 +15,19 @@ function ReactDataTable({
   staticData = null,
   emptyText,
   rowHeights = 40,
-  headerProps = {} // Added default value
+  headerProps = {},
+  selected={}
 }) {
   const tableContainerRef = React.useRef(null);
   const [data, setData] = React.useState({ pages: [], meta: { totalPages: 1 } });
   const [isFetching, setIsFetching] = React.useState(false);
   const [pageParam, setPageParam] = React.useState(1);
-  const [selectedRows, setSelectedRows] = React.useState({});
+  const [selectedRows, setSelectedRows] = React.useState(selected);
 
+ 
+   useEffect(()=>{
+    setSelectedRows({...selected})
+   },[selected])
 
   useEffect(() => {
     setData({ pages: [], meta: { totalPages: 1 } });
@@ -169,6 +174,7 @@ function ReactDataTable({
         <input
           id={data.id}
           type="checkbox"
+          className='bg-gray-700 rounded-4 border-gray-200 text-blue-400 focus:ring-0 focus:ring-white'
           checked={Object.keys(selectedRows).length > 0 && data.every(row => selectedRows[row.id])}
           onChange={(e) => handleSelectAll(e.target.checked, flatData)}
         />
@@ -178,6 +184,7 @@ function ReactDataTable({
       return (
         <div className="flex items-center justify-center h-[40px]" onClick={(e) => e.stopPropagation()}>
           <input
+            id={row.id}
             type="checkbox"
             className='bg-gray-700 rounded-4 border-gray-200 text-blue-400 focus:ring-0 focus:ring-white'
             checked={!!selectedRows[row.id]}