tsgrid-ui 1.0.0

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.
Files changed (10) hide show
  1. package/CHANGELOG.md +50 -0
  2. package/LICENSE +22 -0
  3. package/MIGRATION-FROM-W2UI.md +191 -0
  4. package/dist/tsgrid-ui.css +4264 -0
  5. package/dist/tsgrid-ui.d.ts +2432 -0
  6. package/dist/tsgrid-ui.es6.js +24236 -0
  7. package/dist/tsgrid-ui.js +24309 -0
  8. package/dist/tsgrid-ui.min.css +2 -0
  9. package/package.json +88 -0
  10. package/readme.md +107 -0
package/package.json ADDED
@@ -0,0 +1,88 @@
1
+ {
2
+ "name": "tsgrid-ui",
3
+ "version": "1.0.0",
4
+ "title": "TsGrid UI: TypeScript-native UI component library",
5
+ "description": "TypeScript-native UI components: data grid, forms, fields, layout, sidebar, tabs, toolbar, popup, tooltip. ESM + CJS dual bundle, .d.ts rollup, zero runtime dependencies.",
6
+ "license": "MIT",
7
+ "author": "DaverSoGT <jodaniheso@gmail.com>",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "https://github.com/DaverSoGT/tsgrid-ui.git"
11
+ },
12
+ "homepage": "https://github.com/DaverSoGT/tsgrid-ui",
13
+ "bugs": "https://github.com/DaverSoGT/tsgrid-ui/issues",
14
+ "keywords": [
15
+ "typescript",
16
+ "ui",
17
+ "grid",
18
+ "datagrid",
19
+ "form",
20
+ "layout",
21
+ "sidebar",
22
+ "tabs",
23
+ "toolbar",
24
+ "popup",
25
+ "tooltip",
26
+ "esm",
27
+ "components"
28
+ ],
29
+ "main": "dist/tsgrid-ui.js",
30
+ "module": "dist/tsgrid-ui.es6.js",
31
+ "types": "dist/tsgrid-ui.d.ts",
32
+ "exports": {
33
+ ".": {
34
+ "types": "./dist/tsgrid-ui.d.ts",
35
+ "import": "./dist/tsgrid-ui.es6.js",
36
+ "require": "./dist/tsgrid-ui.js"
37
+ },
38
+ "./css": "./dist/tsgrid-ui.css"
39
+ },
40
+ "style": "dist/tsgrid-ui.css",
41
+ "files": [
42
+ "dist/",
43
+ "LICENSE",
44
+ "README.md",
45
+ "CHANGELOG.md",
46
+ "MIGRATION-FROM-W2UI.md"
47
+ ],
48
+ "devDependencies": {
49
+ "@playwright/test": "^1.59.1",
50
+ "@types/node": "^25.6.2",
51
+ "@typescript-eslint/eslint-plugin": "^7.18.0",
52
+ "@typescript-eslint/parser": "^7.18.0",
53
+ "del": "^6.0.0",
54
+ "eslint": "^8.25.0",
55
+ "eslint-plugin-align-assignments": "^1.1.2",
56
+ "gulp": "^4.0.2",
57
+ "gulp-clean-css": "^4.3.0",
58
+ "gulp-concat": "^2.6.1",
59
+ "gulp-header": "^2.0.9",
60
+ "gulp-iconfont": "^11.0.0",
61
+ "gulp-less": "^4.0.1",
62
+ "gulp-rename": "^2.0.0",
63
+ "gulp-replace": "^1.0.0",
64
+ "jsdom": "^29.1.1",
65
+ "run-script-os": "^1.1.6",
66
+ "tsup": "^8.5.1",
67
+ "typescript": "^5.9.3",
68
+ "vitest": "^4.1.5"
69
+ },
70
+ "scripts": {
71
+ "start": "run-script-os",
72
+ "start:win32": "start http://localhost:3500 & python -m http.server 3500",
73
+ "start:nix": "open http://localhost:3500; python3 -m http.server 3500",
74
+ "lint": "eslint src --ext .js,.ts",
75
+ "typecheck": "tsc --noEmit",
76
+ "build:css": "gulp less && gulp icons",
77
+ "build:js": "tsup --config tsup.config.ts && node scripts/wrap-legacy.mjs",
78
+ "build": "pnpm build:css && pnpm build:js",
79
+ "smoke": "playwright test",
80
+ "smoke:update": "playwright test --update-snapshots",
81
+ "consumer-smoke": "tsc --noEmit --project test/tsconfig.json",
82
+ "test:unit": "vitest run --passWithNoTests",
83
+ "test:unit:watch": "vitest",
84
+ "verify": "pnpm lint && pnpm typecheck && pnpm consumer-smoke && pnpm test:unit && pnpm smoke",
85
+ "test": "pnpm lint && pnpm typecheck",
86
+ "dev": "tsup --watch"
87
+ }
88
+ }
package/readme.md ADDED
@@ -0,0 +1,107 @@
1
+ # TsGrid UI
2
+
3
+ TypeScript-native UI component library: data grid, forms, fields, layout, sidebar, tabs, toolbar, popup, tooltip. Strict-mode TypeScript port of the venerable w2ui v2.0 codebase, with modern tooling, zero runtime dependencies, and full `.d.ts` declarations.
4
+
5
+ > **This is a hard fork of [w2ui](https://github.com/vitmalina/w2ui) by Vit Malina.** See [Acknowledgments](#acknowledgments) below.
6
+
7
+ [![npm version](https://img.shields.io/npm/v/tsgrid-ui.svg)](https://www.npmjs.com/package/tsgrid-ui)
8
+ [![license](https://img.shields.io/npm/l/tsgrid-ui.svg)](LICENSE)
9
+
10
+ ## Install
11
+
12
+ ```bash
13
+ pnpm add tsgrid-ui
14
+ # or: npm install tsgrid-ui
15
+ # or: yarn add tsgrid-ui
16
+ ```
17
+
18
+ ## Quick start
19
+
20
+ ```ts
21
+ import { TsGrid } from 'tsgrid-ui'
22
+ import 'tsgrid-ui/css'
23
+
24
+ const grid = new TsGrid({
25
+ name: 'mygrid',
26
+ columns: [
27
+ { field: 'name', text: 'Name', size: '50%' },
28
+ { field: 'email', text: 'Email', size: '50%' }
29
+ ],
30
+ records: [
31
+ { recid: 1, name: 'Ada Lovelace', email: 'ada@example.com' },
32
+ { recid: 2, name: 'Alan Turing', email: 'alan@example.com' },
33
+ { recid: 3, name: 'Grace Hopper', email: 'grace@example.com' }
34
+ ]
35
+ })
36
+ grid.render('#mygrid')
37
+ ```
38
+
39
+ ```html
40
+ <div id="mygrid" style="width: 600px; height: 300px;"></div>
41
+ ```
42
+
43
+ ## Components
44
+
45
+ | Class | Purpose |
46
+ |-------------|------------------------------------------------|
47
+ | `TsGrid` | Data grid with sort / search / select / edit |
48
+ | `TsForm` | Form with field validation + submit lifecycle |
49
+ | `TsField` | Standalone field types (text/list/date/color/file) |
50
+ | `TsLayout` | 6-panel resizable layout |
51
+ | `TsSidebar` | Tree / sidebar with expandable nodes |
52
+ | `TsTabs` | Tab strip |
53
+ | `TsToolbar` | Toolbar with multiple item types |
54
+ | `TsTooltip` | Hover tooltips and overlays |
55
+ | `TsPopup` | Modal popup, alert, confirm, prompt |
56
+
57
+ Helpers exported: `TsAlert`, `TsConfirm`, `TsPrompt`, `TsColor`, `TsDate`, `TsMenu`, `TsDialog`, `TsUtils`, `TsLocale`, `TsBase`, `TsEvent`, `TsUi` (instance registry), `query` (DOM helper), plus branded primitive types `RecId`, `LayoutPanelId`, `FieldName`.
58
+
59
+ ## TypeScript support
60
+
61
+ Full type declarations ship in `dist/w2ui.d.ts` (will be renamed to `dist/tsgrid-ui.d.ts` once the build artifacts are rebuilt — see CHANGELOG). Strict mode is active in source: `strict`, `noUncheckedIndexedAccess`, `exactOptionalPropertyTypes`, `noImplicitOverride`, `noPropertyAccessFromIndexSignature`.
62
+
63
+ ```ts
64
+ import { TsGrid, type TsGridColumn, type TsGridCellSelection } from 'tsgrid-ui'
65
+
66
+ const cols: TsGridColumn[] = [
67
+ { field: 'name', text: 'Name', sortable: true }
68
+ ]
69
+ ```
70
+
71
+ ## Building
72
+
73
+ ```bash
74
+ pnpm install
75
+ pnpm build # CSS (gulp) + JS (tsup) + .d.ts rollup
76
+ pnpm verify # lint + typecheck + consumer-smoke + unit tests + Playwright smoke
77
+ ```
78
+
79
+ | Script | Purpose |
80
+ |----------------------|-----------------------------------------------------|
81
+ | `pnpm test` | ESLint + `tsc --noEmit` |
82
+ | `pnpm test:unit` | Vitest unit suite (w2utils helpers, w2base events, types brands) |
83
+ | `pnpm consumer-smoke`| Typecheck the public API surface as a consumer would |
84
+ | `pnpm smoke` | Playwright DOM smoke harness (38 tests) |
85
+ | `pnpm verify` | All of the above, end-to-end |
86
+ | `pnpm dev` | tsup watch mode for JS bundle |
87
+ | `pnpm start` | Local dev server (Python http.server) on :3500 |
88
+
89
+ ## Migration from w2ui
90
+
91
+ If you're coming from `w2ui` v2.0 or v2.1, see [MIGRATION-FROM-W2UI.md](MIGRATION-FROM-W2UI.md) for the complete renaming map (JS globals, CSS classes, file paths, jQuery shim removal).
92
+
93
+ ## Acknowledgments
94
+
95
+ TsGrid UI is a hard fork of **[w2ui](https://github.com/vitmalina/w2ui)** by **Vit Malina** ([@vitmalina](https://github.com/vitmalina)). The original w2ui (MIT-licensed, started in 2014) was the foundation for this project — every widget pattern, every interaction model, and most of the architectural decisions originate there. This fork's contribution is:
96
+
97
+ - A full **TypeScript-native** port (the original was JS with optional types).
98
+ - Modern **tsup / esbuild** build pipeline replacing the original Gulp-based regex concat.
99
+ - **Zero runtime dependencies** — the jQuery shim (`w2compat`) was removed.
100
+ - **Vitest** unit test layer alongside the original Playwright smoke harness.
101
+ - **Renamed identity** at every layer (package, globals, classes, types, CSS classes) to operate as an independent library while preserving the original's MIT copyright per license terms.
102
+
103
+ If you need the original library, please use [vitmalina/w2ui](https://github.com/vitmalina/w2ui).
104
+
105
+ ## License
106
+
107
+ [MIT](LICENSE) — preserves the original w2ui copyright (2014, Vit Malina) and adds the fork copyright (2026, DaverSoGT). You are free to use, modify, and redistribute under MIT terms.