react-live-data-table 1.0.4 → 1.0.5

Sign up to get free protection for your applications and to get access to all the features.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-live-data-table",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "Your React component package with Tailwind",
5
5
  "main": "src/index.js",
6
6
  "module": "dist/index.esm.js",
package/readme.md CHANGED
@@ -42,25 +42,3 @@ A flexible React data grid component with support for pagination, row selection,
42
42
  | `headerProps` | `object` | `{}` | Custom header properties |
43
43
 
44
44
  ## Basic Usage
45
- jsx
46
- import { ReactDataTable } from 'react-data-grid';
47
-
48
- const App = () => {
49
- const columns = [
50
- { field: 'id', headerName: 'ID' },
51
- { field: 'name', headerName: 'Name' }
52
- ];
53
-
54
- const data = [
55
- { id: 1, name: 'John' },
56
- { id: 2, name: 'Jane' }
57
- ];
58
-
59
- return (
60
- <ReactDataTable
61
- columns={columns}
62
- dataSource={data}
63
- />
64
- );
65
- };
66
-
@@ -190,17 +190,31 @@ function ReactDataTable({
190
190
  <div className="bg-white relative w-full">
191
191
  {loading && (
192
192
  <div className="absolute inset-0 bg-white/50 z-20 flex items-center justify-center">
193
- <div data-testid="loading-spinner" role="status" className="p-2">
194
- <svg className="h-10 w-10 animate-spin text-blue-500" viewBox="0 0 50 50" fill="none">
195
- <circle className="opacity-25" cx="25" cy="25" r="20" stroke="currentColor" strokeWidth="4"></circle>
196
- <path
197
- className="opacity-75"
198
- fill="currentColor"
199
- d="M25 5a20 20 0 0119.39 15h-4.02a16 16 0 00-30.74 0H5.61A20 20 0 0125 5z"
200
- ></path>
201
- </svg>
202
- <span className="sr-only">Loading...</span>
203
- </div>
193
+ <div className={`flex items-center justify-center`}>
194
+ <div role="status" className="relative">
195
+ <svg
196
+ className={`animate-spin w-6 h-6}`}
197
+ viewBox="0 0 24 24"
198
+ fill="none"
199
+ xmlns="http://www.w3.org/2000/svg"
200
+ >
201
+ <circle
202
+ className="opacity-25"
203
+ cx="12"
204
+ cy="12"
205
+ r="10"
206
+ stroke="currentColor"
207
+ strokeWidth="4"
208
+ />
209
+ <path
210
+ className="opacity-75"
211
+ fill="currentColor"
212
+ d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
213
+ />
214
+ </svg>
215
+ <span className="sr-only">Loading...</span>
216
+ </div>
217
+ </div>
204
218
  </div>
205
219
  )}
206
220