@guiexpert/preact-table 1.0.6 → 1.0.8
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/README.md +14 -15
- package/index.cjs +63 -63
- package/index.js +6868 -6786
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -13,7 +13,7 @@ This is the UI-agnostic table component for your next web app. 😊
|
|
|
13
13
|
- Handle large datasets easily
|
|
14
14
|
- Excellent performance for large tables by vertical and horizontal virtual scrolling
|
|
15
15
|
- Fully-featured (advanced sorting and filtering)
|
|
16
|
-
- Highly customizable
|
|
16
|
+
- Highly customizable orderData grid
|
|
17
17
|
- Outstanding performance
|
|
18
18
|
- No third-party dependencies
|
|
19
19
|
- UI-agnostic
|
|
@@ -51,11 +51,11 @@ Add the following two NPM packages to your existing preact project (run this in
|
|
|
51
51
|
npm install --save @guiexpert/table @guiexpert/preact-table
|
|
52
52
|
```
|
|
53
53
|
|
|
54
|
-
Add
|
|
54
|
+
Add GuiexpertTable component to a template:
|
|
55
55
|
|
|
56
56
|
```
|
|
57
57
|
return (
|
|
58
|
-
<
|
|
58
|
+
<GuiexpertTable
|
|
59
59
|
tableOptions={tableOptions}
|
|
60
60
|
tableModel={tableModel}
|
|
61
61
|
mouseClicked={console.info}
|
|
@@ -66,11 +66,11 @@ return (
|
|
|
66
66
|
|
|
67
67
|
Import the following classes in your component:
|
|
68
68
|
```
|
|
69
|
-
import {
|
|
69
|
+
import { GuiexpertTable } from "@guiexpert/preact-table";
|
|
70
70
|
import {
|
|
71
71
|
GeMouseEvent,
|
|
72
72
|
TableApi
|
|
73
|
-
|
|
73
|
+
TableFactory,
|
|
74
74
|
TableModelIf,
|
|
75
75
|
TableOptions,
|
|
76
76
|
TableOptionsIf
|
|
@@ -81,16 +81,15 @@ import {
|
|
|
81
81
|
Add a tableModel property and a onTableReady method to the component:
|
|
82
82
|
|
|
83
83
|
```
|
|
84
|
-
const tableModel: TableModelIf =
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
};
|
|
84
|
+
const tableModel: TableModelIf = TableFactory.createTableModel({
|
|
85
|
+
headerData: [
|
|
86
|
+
['Header 1', 'Header 2']
|
|
87
|
+
],
|
|
88
|
+
bodyData: [
|
|
89
|
+
['Text 1a', 'Text 2a'],
|
|
90
|
+
['Text 1b', 'Text 2b'],
|
|
91
|
+
]
|
|
92
|
+
});
|
|
94
93
|
const tableOptions = new TableOptions();
|
|
95
94
|
|
|
96
95
|
function onTableReady(api: TableApi) {
|