Add pending apps and frontend components
- apps/captain-mobile: Mobile API service - apps/flow-ui: Flow UI application - apps/mindlink: Mindlink application - apps/storage: Storage API and workers - apps/tzzr-cli: TZZR CLI tool - deck-frontend/backups: Historical TypeScript versions - hst-frontend: Standalone HST frontend Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,42 @@
|
||||
export abstract class Component<P extends object = object> {
|
||||
protected element: HTMLElement;
|
||||
protected props: P;
|
||||
|
||||
constructor(props: P) {
|
||||
this.props = props;
|
||||
this.element = this.createElement();
|
||||
this.bindEvents();
|
||||
}
|
||||
|
||||
protected abstract template(): string;
|
||||
|
||||
protected createElement(): HTMLElement {
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.innerHTML = this.template().trim();
|
||||
return wrapper.firstElementChild as HTMLElement;
|
||||
}
|
||||
|
||||
protected bindEvents(): void {
|
||||
// Override in subclasses
|
||||
}
|
||||
|
||||
public mount(container: HTMLElement): void {
|
||||
container.appendChild(this.element);
|
||||
}
|
||||
|
||||
public unmount(): void {
|
||||
this.element.remove();
|
||||
}
|
||||
|
||||
public update(props: Partial<P>): void {
|
||||
this.props = { ...this.props, ...props };
|
||||
const newElement = this.createElement();
|
||||
this.element.replaceWith(newElement);
|
||||
this.element = newElement;
|
||||
this.bindEvents();
|
||||
}
|
||||
|
||||
public getElement(): HTMLElement {
|
||||
return this.element;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user