@tipolox/litgrid-web 1.0.1 → 1.0.2
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 +48 -0
- package/package.json +3 -3
package/README.md
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
# @tipolox/litgrid-web
|
|
2
|
+
|
|
3
|
+
LitGrid's `yc-grid` Web Component: a virtualized data grid for browser applications. Importing the package registers the custom element.
|
|
4
|
+
|
|
5
|
+
## Install
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @tipolox/litgrid-web
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
Use a modern browser with native Web Component support and a bundler that supports ECMAScript modules.
|
|
12
|
+
|
|
13
|
+
## Quick start
|
|
14
|
+
|
|
15
|
+
Add the element to your page:
|
|
16
|
+
|
|
17
|
+
```html
|
|
18
|
+
<yc-grid></yc-grid>
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
Run this in your application entry point after the element is in the DOM:
|
|
22
|
+
|
|
23
|
+
```ts
|
|
24
|
+
import '@tipolox/litgrid-web'
|
|
25
|
+
import type { DataGridElement } from '@tipolox/litgrid-web'
|
|
26
|
+
|
|
27
|
+
const grid = document.querySelector('yc-grid') as DataGridElement
|
|
28
|
+
grid.data = [
|
|
29
|
+
{ id: 1, name: 'Ada' },
|
|
30
|
+
{ id: 2, name: 'Grace' }
|
|
31
|
+
]
|
|
32
|
+
grid.columns = [
|
|
33
|
+
{ key: 'id', header: 'ID', width: 80 },
|
|
34
|
+
{ key: 'name', header: 'Name', width: 180 }
|
|
35
|
+
]
|
|
36
|
+
grid.viewportHeight = 400
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
`viewportHeight` defines the viewport used for row virtualization.
|
|
40
|
+
|
|
41
|
+
## Resources
|
|
42
|
+
|
|
43
|
+
- [Live demo](https://tipolox.com/litgrid/demo)
|
|
44
|
+
- [Repository](https://github.com/tipolox/litgrid)
|
|
45
|
+
- [Web Component guide](https://github.com/tipolox/litgrid/blob/main/docs/vanilla-js-guide.md)
|
|
46
|
+
- [API reference](https://github.com/tipolox/litgrid/blob/main/docs/api-reference.md)
|
|
47
|
+
|
|
48
|
+
Licensed under the [MIT License](https://github.com/tipolox/litgrid/blob/main/LICENSE).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tipolox/litgrid-web",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "LitGrid DataGrid Web Component.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -39,8 +39,8 @@
|
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"lit": "^3.3.2",
|
|
42
|
-
"@tipolox/litgrid-core": "^1.0.
|
|
43
|
-
"@tipolox/litgrid-renderer": "^1.0.
|
|
42
|
+
"@tipolox/litgrid-core": "^1.0.2",
|
|
43
|
+
"@tipolox/litgrid-renderer": "^1.0.2"
|
|
44
44
|
},
|
|
45
45
|
"scripts": {
|
|
46
46
|
"prebuild": "node -e \"const fs=require('node:fs'); fs.rmSync('dist',{recursive:true,force:true}); fs.mkdirSync('dist',{recursive:true}); fs.copyFileSync('../../LICENSE','dist/LICENSE')\"",
|