react-live-data-table 1.0.4 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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