32 lines
857 B
TypeScript
32 lines
857 B
TypeScript
import type { Html } from './html.js';
|
|
import { htmlElementContext, type HtmlElementContext } from './store.js';
|
|
|
|
type ComponentOptions<T> = (options: { props: T; context: HtmlElementContext['get'] }) => Html;
|
|
|
|
const component = <T>(options: ComponentOptions<T>) => {
|
|
const render = (props: T) => {
|
|
const toHtmlElement = () => {
|
|
const root = document.createElement('div');
|
|
root.style.display = 'content';
|
|
const context = htmlElementContext(root);
|
|
const api = { context: context.get, props };
|
|
const view = options(api);
|
|
context.emitter.addEventListener('change', () => {
|
|
view(root);
|
|
});
|
|
view(root);
|
|
return root;
|
|
};
|
|
|
|
return {
|
|
toHtmlElement,
|
|
};
|
|
};
|
|
|
|
return Object.assign(render, {
|
|
toHtmlElement: () => render({} as T).toHtmlElement(),
|
|
});
|
|
};
|
|
|
|
export { component };
|