@panyam/tsappkit 0.0.3
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 +98 -0
- package/dist/index.d.mts +866 -0
- package/dist/index.d.ts +866 -0
- package/dist/index.js +1736 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +1718 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +43 -0
- package/src/BasePage.ts +270 -0
- package/src/Component.ts +178 -0
- package/src/DOMUtils.ts +72 -0
- package/src/EventBus.ts +272 -0
- package/src/KeyboardShortcutManager.ts +435 -0
- package/src/LCMComponent.ts +140 -0
- package/src/LifecycleController.ts +213 -0
- package/src/MobileBottomDrawer.ts +236 -0
- package/src/Modal.ts +233 -0
- package/src/SplashScreen.ts +111 -0
- package/src/TemplateLoader.ts +101 -0
- package/src/ThemeManager.ts +100 -0
- package/src/ToastManager.ts +161 -0
- package/src/events.ts +5 -0
- package/src/index.ts +39 -0
package/README.md
ADDED
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
# @panyam/tsappkit
|
|
2
|
+
|
|
3
|
+
TypeScript application toolkit with component lifecycle management, event system, and UI utilities.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @panyam/tsappkit
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Features
|
|
12
|
+
|
|
13
|
+
### Component Lifecycle System
|
|
14
|
+
|
|
15
|
+
A sophisticated component lifecycle system that eliminates initialization order dependencies and race conditions:
|
|
16
|
+
|
|
17
|
+
- **LCMComponent**: Lifecycle Managed Component interface with 4-phase initialization
|
|
18
|
+
- **LifecycleController**: Breadth-first component orchestration with synchronization barriers
|
|
19
|
+
- **BaseComponent**: Abstract base class with event bus integration
|
|
20
|
+
|
|
21
|
+
```typescript
|
|
22
|
+
import { BaseComponent, LCMComponent, LifecycleController, EventBus } from '@panyam/tsappkit';
|
|
23
|
+
|
|
24
|
+
class MyComponent extends BaseComponent {
|
|
25
|
+
performLocalInit(): LCMComponent[] {
|
|
26
|
+
// Phase 1: Initialize and return child components
|
|
27
|
+
return [];
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
setupDependencies(): void {
|
|
31
|
+
// Phase 2: Receive dependencies
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
activate(): void {
|
|
35
|
+
// Phase 3: Component is ready
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
deactivate(): void {
|
|
39
|
+
// Cleanup
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
### Event System
|
|
45
|
+
|
|
46
|
+
Type-safe event bus with error isolation:
|
|
47
|
+
|
|
48
|
+
```typescript
|
|
49
|
+
import { EventBus, EventSubscriber } from '@panyam/tsappkit';
|
|
50
|
+
|
|
51
|
+
class MySubscriber implements EventSubscriber {
|
|
52
|
+
handleBusEvent(eventType: string, data: any, subject: any, emitter: any): void {
|
|
53
|
+
console.log(`Received ${eventType}:`, data);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
const eventBus = new EventBus();
|
|
58
|
+
eventBus.addSubscription('my-event', null, new MySubscriber());
|
|
59
|
+
eventBus.emit('my-event', { value: 42 }, null, this);
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
### UI Components
|
|
63
|
+
|
|
64
|
+
- **Modal**: Singleton modal dialog manager with template loading
|
|
65
|
+
- **ToastManager**: Toast notification system
|
|
66
|
+
- **ThemeManager**: Light/dark/system theme management
|
|
67
|
+
- **SplashScreen**: Loading screen with progress updates
|
|
68
|
+
- **MobileBottomDrawer**: Swipe-to-close drawer for mobile
|
|
69
|
+
- **TemplateLoader**: HTML template loading system
|
|
70
|
+
|
|
71
|
+
### Utilities
|
|
72
|
+
|
|
73
|
+
- **DOMUtils**: Input context detection, modifier key checks
|
|
74
|
+
- **KeyboardShortcutManager**: Multi-key keyboard shortcut system with state machine
|
|
75
|
+
|
|
76
|
+
## Usage with BasePage
|
|
77
|
+
|
|
78
|
+
```typescript
|
|
79
|
+
import { BasePage, LCMComponent } from '@panyam/tsappkit';
|
|
80
|
+
|
|
81
|
+
class MyPage extends BasePage {
|
|
82
|
+
protected initializeSpecificComponents(): LCMComponent[] {
|
|
83
|
+
// Initialize page-specific components
|
|
84
|
+
return [];
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
protected bindSpecificEvents(): void {
|
|
88
|
+
// Bind page-specific event handlers
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
// Auto-initialize on DOM ready
|
|
93
|
+
BasePage.loadAfterPageLoaded('myPage', MyPage, 'MyPage');
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
## License
|
|
97
|
+
|
|
98
|
+
MIT
|