@vorra/core 0.3.0

package/dist/dom.d.ts

@@ -0,0 +1,136 @@
+import type { EffectHandle } from './reactivity.js';
+import { Injector } from './di.js';
+import type { Provider } from './di.js';
+export interface ComponentContext {
+    injector: Injector;
+    effects: EffectHandle[];
+    children: ComponentContext[];
+}
+/**
+ * Creates a DOM element with the given tag name.
+ *
+ * @example
+ * const div = createElement('div');
+ */
+export declare function createElement(tag: string): Element;
+/**
+ * Sets a static attribute on an element.
+ *
+ * @example
+ * setAttr(el, 'class', 'container');
+ */
+export declare function setAttr(el: Element, name: string, value: string): void;
+/**
+ * Sets a DOM property directly (e.g. value, checked, disabled).
+ *
+ * @example
+ * setProp(input, 'value', 'hello');
+ */
+export declare function setProp(el: Element, name: string, value: unknown): void;
+/**
+ * Attaches an event listener and returns an EffectHandle to remove it.
+ *
+ * @example
+ * const handle = listen(btn, 'click', () => count.update(n => n + 1));
+ * handle.destroy(); // removes listener
+ */
+export declare function listen(el: Element, event: string, handler: EventListener): EffectHandle;
+/**
+ * Inserts a child node into a parent, optionally before an anchor node.
+ *
+ * @example
+ * insert(container, textNode);
+ * insert(list, item, anchor); // insert before anchor
+ */
+export declare function insert(parent: Node, child: Node, anchor?: Node | null): void;
+/**
+ * Removes a node from the DOM.
+ *
+ * @example
+ * remove(el);
+ */
+export declare function remove(node: Node): void;
+/**
+ * Binds a getter to a Text node's content. The text updates surgically
+ * whenever the getter's signal dependencies change.
+ *
+ * @example
+ * const t = document.createTextNode('');
+ * bindText(t, () => String(count()));
+ */
+export declare function bindText(node: Text, getter: () => string): EffectHandle;
+/**
+ * Binds a getter to an element attribute. When the getter returns `null`,
+ * the attribute is removed.
+ *
+ * @example
+ * bindAttr(el, 'disabled', () => isDisabled() ? '' : null);
+ */
+export declare function bindAttr(el: Element, name: string, getter: () => string | null): EffectHandle;
+/**
+ * Binds a getter to a DOM property. Updates the property directly whenever
+ * the getter's signal dependencies change.
+ *
+ * @example
+ * bindProp(input, 'value', () => name());
+ */
+export declare function bindProp(el: Element, name: string, getter: () => unknown): EffectHandle;
+/**
+ * Binds a getter to element visibility. When the getter returns `false`,
+ * `display: none` is applied; otherwise the inline style is cleared.
+ *
+ * @example
+ * bindShow(el, () => isVisible());
+ */
+export declare function bindShow(el: Element, getter: () => boolean): EffectHandle;
+/**
+ * Binds a getter to a set of CSS classes. Each key in the record is a class
+ * name; when the value is `true` the class is added, when `false` it is
+ * removed. Classes not in the record are left untouched.
+ *
+ * @example
+ * bindClass(el, () => ({ active: isActive(), disabled: isDisabled() }));
+ */
+export declare function bindClass(el: Element, getter: () => Record<string, boolean>): EffectHandle;
+/**
+ * Creates a ComponentContext scoped to a child injector derived from
+ * `parentInjector`. The context owns all EffectHandles created during
+ * the component's lifetime.
+ *
+ * @example
+ * const ctx = createComponent(app, [{ provide: MY_TOKEN, useValue: 42 }]);
+ */
+export declare function createComponent(parentInjector: Injector, providers?: Provider[]): ComponentContext;
+/**
+ * Tears down a ComponentContext: destroys all child contexts recursively,
+ * then destroys all owned effects, then destroys the injector.
+ *
+ * @example
+ * destroyComponent(ctx);
+ */
+export declare function destroyComponent(ctx: ComponentContext): void;
+/**
+ * Mounts a compiled component factory into a container element. The factory
+ * receives the ComponentContext, builds the DOM subtree, and returns the
+ * root node which is then appended to the container.
+ *
+ * @example
+ * mountComponent(counterFactory, document.getElementById('app')!, ctx);
+ */
+export declare function mountComponent(factory: (ctx: ComponentContext, props?: Record<string, () => unknown>) => Node, container: Element, ctx: ComponentContext): void;
+/**
+ * Instantiates a child component inside a parent's template. Creates a child
+ * ComponentContext scoped under the parent, registers it for lifecycle
+ * tracking, invokes the factory with the given props, and returns the root
+ * DOM node so the caller can insert it into the tree.
+ *
+ * Props are always passed as getter functions so both static and reactive
+ * values share a uniform call-site API: `props['label']()`.
+ *
+ * @example
+ * // In a compiled parent template:
+ * const _e1 = mountChild(MyButton, ctx, { label: () => 'Click me' });
+ * insert(_e0, _e1);
+ */
+export declare function mountChild(factory: (ctx: ComponentContext, props: Record<string, () => unknown>) => Node, parentCtx: ComponentContext, props?: Record<string, () => unknown>): Node;
+//# sourceMappingURL=dom.d.ts.map

package/dist/dom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../src/dom.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAMxC,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,QAAQ,CAAC;IACnB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,QAAQ,EAAE,gBAAgB,EAAE,CAAC;CAC9B;AAMD;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAElD;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAEtE;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,IAAI,CAEvE;AAED;;;;;;GAMG;AACH,wBAAgB,MAAM,CACpB,EAAE,EAAE,OAAO,EACX,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,aAAa,GACrB,YAAY,CAOd;AAED;;;;;;GAMG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAE5E;AAED;;;;;GAKG;AACH,wBAAgB,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAEvC;AAMD;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,MAAM,GAAG,YAAY,CAIvE;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,MAAM,GAAG,IAAI,GAC1B,YAAY,CASd;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,OAAO,GACpB,YAAY,CAId;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,GAAG,YAAY,CAIzE;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CACvB,EAAE,EAAE,OAAO,EACX,MAAM,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GACpC,YAAY,CAwBd;AAMD;;;;;;;GAOG;AACH,wBAAgB,eAAe,CAC7B,cAAc,EAAE,QAAQ,EACxB,SAAS,CAAC,EAAE,QAAQ,EAAE,GACrB,gBAAgB,CAOlB;AAED;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,gBAAgB,GAAG,IAAI,CAe5D;AAED;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAC5B,OAAO,EAAE,CAAC,GAAG,EAAE,gBAAgB,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,KAAK,IAAI,EAC/E,SAAS,EAAE,OAAO,EAClB,GAAG,EAAE,gBAAgB,GACpB,IAAI,CAGN;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,UAAU,CACxB,OAAO,EAAE,CAAC,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,KAAK,IAAI,EAC9E,SAAS,EAAE,gBAAgB,EAC3B,KAAK,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAM,GACxC,IAAI,CAIN"}

package/dist/dom.js

@@ -0,0 +1,285 @@
+import { effect } from "./reactivity.js";
+//#region src/dom.ts
+/**
+* Creates a DOM element with the given tag name.
+*
+* @example
+* const div = createElement('div');
+*/
+function createElement(tag) {
+	return document.createElement(tag);
+}
+/**
+* Sets a static attribute on an element.
+*
+* @example
+* setAttr(el, 'class', 'container');
+*/
+function setAttr(el, name, value) {
+	el.setAttribute(name, value);
+}
+/**
+* Sets a DOM property directly (e.g. value, checked, disabled).
+*
+* @example
+* setProp(input, 'value', 'hello');
+*/
+function setProp(el, name, value) {
+	el[name] = value;
+}
+/**
+* Attaches an event listener and returns an EffectHandle to remove it.
+*
+* @example
+* const handle = listen(btn, 'click', () => count.update(n => n + 1));
+* handle.destroy(); // removes listener
+*/
+function listen(el, event, handler) {
+	el.addEventListener(event, handler);
+	return { destroy() {
+		el.removeEventListener(event, handler);
+	} };
+}
+/**
+* Inserts a child node into a parent, optionally before an anchor node.
+*
+* @example
+* insert(container, textNode);
+* insert(list, item, anchor); // insert before anchor
+*/
+function insert(parent, child, anchor) {
+	parent.insertBefore(child, anchor ?? null);
+}
+/**
+* Removes a node from the DOM.
+*
+* @example
+* remove(el);
+*/
+function remove(node) {
+	node.parentNode?.removeChild(node);
+}
+/**
+* Binds a getter to a Text node's content. The text updates surgically
+* whenever the getter's signal dependencies change.
+*
+* @example
+* const t = document.createTextNode('');
+* bindText(t, () => String(count()));
+*/
+function bindText(node, getter) {
+	return effect(() => {
+		node.nodeValue = getter();
+	});
+}
+/**
+* Binds a getter to an element attribute. When the getter returns `null`,
+* the attribute is removed.
+*
+* @example
+* bindAttr(el, 'disabled', () => isDisabled() ? '' : null);
+*/
+function bindAttr(el, name, getter) {
+	return effect(() => {
+		const value = getter();
+		if (value === null) el.removeAttribute(name);
+		else el.setAttribute(name, value);
+	});
+}
+/**
+* Binds a getter to a DOM property. Updates the property directly whenever
+* the getter's signal dependencies change.
+*
+* @example
+* bindProp(input, 'value', () => name());
+*/
+function bindProp(el, name, getter) {
+	return effect(() => {
+		el[name] = getter();
+	});
+}
+/**
+* Binds a getter to element visibility. When the getter returns `false`,
+* `display: none` is applied; otherwise the inline style is cleared.
+*
+* @example
+* bindShow(el, () => isVisible());
+*/
+function bindShow(el, getter) {
+	return effect(() => {
+		el.style.display = getter() ? "" : "none";
+	});
+}
+/**
+* Binds a getter to a set of CSS classes. Each key in the record is a class
+* name; when the value is `true` the class is added, when `false` it is
+* removed. Classes not in the record are left untouched.
+*
+* @example
+* bindClass(el, () => ({ active: isActive(), disabled: isDisabled() }));
+*/
+function bindClass(el, getter) {
+	let prevClasses = {};
+	return effect(() => {
+		const next = getter();
+		for (const name of Object.keys(prevClasses)) if (prevClasses[name] === true && !next[name]) el.classList.remove(name);
+		for (const [name, active] of Object.entries(next)) if (active) el.classList.add(name);
+		else el.classList.remove(name);
+		prevClasses = next;
+	});
+}
+/**
+* Reactively renders a list of items before an anchor comment node.
+* Each item receives its own `ComponentContext` scoped under `parentCtx`
+* so that bindings created inside the item template are properly cleaned
+* up whenever the list re-renders.
+*
+* This is the runtime backing for the `@for` template directive.
+*
+* @example
+* // Generated by: <li @for={item of items()}>…</li>
+* const anchor = document.createComment('for');
+* insert(container, anchor);
+* ctx.effects.push(bindList(anchor, ctx, () => items(), (item, i, itemCtx) => {
+*   const li = createElement('li');
+*   const t = document.createTextNode('');
+*   itemCtx.effects.push(bindText(t, () => item.name));
+*   insert(li, t);
+*   return li;
+* }));
+*/
+function bindList(anchor, parentCtx, getter, itemFactory) {
+	let activeItems = [];
+	return effect(() => {
+		const list = getter();
+		const parent = anchor.parentNode;
+		if (!parent) return;
+		for (const { node, ctx } of activeItems) {
+			parent.removeChild(node);
+			const idx = parentCtx.children.indexOf(ctx);
+			if (idx >= 0) parentCtx.children.splice(idx, 1);
+			destroyComponent(ctx);
+		}
+		activeItems = [];
+		for (let i = 0; i < list.length; i++) {
+			const itemCtx = createComponent(parentCtx.injector);
+			parentCtx.children.push(itemCtx);
+			const node = itemFactory(list[i], i, itemCtx);
+			parent.insertBefore(node, anchor);
+			activeItems.push({
+				node,
+				ctx: itemCtx
+			});
+		}
+	});
+}
+/**
+* Creates a ComponentContext scoped to a child injector derived from
+* `parentInjector`. The context owns all EffectHandles created during
+* the component's lifetime.
+*
+* @example
+* const ctx = createComponent(app, [{ provide: MY_TOKEN, useValue: 42 }]);
+*/
+function createComponent(parentInjector, providers) {
+	return {
+		injector: parentInjector.createChild(providers ?? []),
+		effects: [],
+		children: []
+	};
+}
+/**
+* Tears down a ComponentContext: destroys all child contexts recursively,
+* then destroys all owned effects, then destroys the injector.
+*
+* @example
+* destroyComponent(ctx);
+*/
+function destroyComponent(ctx) {
+	for (const child of ctx.children) destroyComponent(child);
+	ctx.children.length = 0;
+	for (const handle of ctx.effects) handle.destroy();
+	ctx.effects.length = 0;
+	ctx.injector.destroy();
+}
+/**
+* Mounts a compiled component factory into a container element. The factory
+* receives the ComponentContext, builds the DOM subtree, and returns the
+* root node which is then appended to the container.
+*
+* @example
+* mountComponent(counterFactory, document.getElementById('app')!, ctx);
+*/
+function mountComponent(factory, container, ctx) {
+	const node = factory(ctx);
+	container.appendChild(node);
+}
+/**
+* Instantiates a child component inside a parent's template. Creates a child
+* ComponentContext scoped under the parent, registers it for lifecycle
+* tracking, invokes the factory with the given props, and returns the root
+* DOM node so the caller can insert it into the tree.
+*
+* Props are always passed as getter functions so both static and reactive
+* values share a uniform call-site API: `props['label']()`.
+*
+* @example
+* // In a compiled parent template:
+* const _e1 = mountChild(MyButton, ctx, { label: () => 'Click me' });
+* insert(_e0, _e1);
+*/
+function mountChild(factory, parentCtx, props = {}) {
+	const childCtx = createComponent(parentCtx.injector);
+	parentCtx.children.push(childCtx);
+	const node = factory(childCtx, props);
+	const hmrId = factory["__hmrId"];
+	if (hmrId) {
+		const hmr = (typeof window !== "undefined" ? window : null)?.["__vorra_hmr"];
+		if (hmr?.instances) {
+			const list = hmr.instances.get(hmrId) ?? [];
+			list.push({
+				node,
+				ctx: childCtx,
+				props,
+				parentCtx
+			});
+			hmr.instances.set(hmrId, list);
+		}
+	}
+	return node;
+}
+/**
+* Replaces all mounted instances of the component identified by `id` with
+* the output of `newFactory`. Called by the HMR client when a `.vorra` chunk
+* is hot-updated. Not intended for use in application code.
+*/
+function hmrAccept(id, newFactory) {
+	const hmr = (typeof window !== "undefined" ? window : null)?.["__vorra_hmr"];
+	if (!hmr?.instances) return;
+	const instances = hmr.instances.get(id) ?? [];
+	for (const inst of instances) {
+		const parent = inst.node.parentNode;
+		if (!parent) continue;
+		const nextSibling = inst.node.nextSibling;
+		destroyComponent(inst.ctx);
+		parent.removeChild(inst.node);
+		const newCtx = createComponent(inst.parentCtx.injector);
+		const idx = inst.parentCtx.children.indexOf(inst.ctx);
+		if (idx >= 0) inst.parentCtx.children[idx] = newCtx;
+		const newNode = newFactory(newCtx, inst.props);
+		parent.insertBefore(newNode, nextSibling);
+		inst.node = newNode;
+		inst.ctx = newCtx;
+	}
+}
+if (typeof __vorra_dev !== "undefined" && __vorra_dev && typeof window !== "undefined") {
+	const w = window;
+	if (!w["__vorra_hmr"]) w["__vorra_hmr"] = {};
+	const hmr = w["__vorra_hmr"];
+	if (!hmr["instances"]) hmr["instances"] = /* @__PURE__ */ new Map();
+	hmr["accept"] = hmrAccept;
+}
+//#endregion
+export { bindAttr, bindClass, bindList, bindProp, bindShow, bindText, createComponent, createElement, destroyComponent, hmrAccept, insert, listen, mountChild, mountComponent, remove, setAttr, setProp };
+
+//# sourceMappingURL=dom.js.map

package/dist/dom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom.js","names":[],"sources":["../src/dom.ts"],"sourcesContent":["// =============================================================================\r\n// Vorra Runtime DOM Layer\r\n// Direct DOM operations + reactive bindings that compiled templates call into.\r\n// =============================================================================\r\n\r\nimport { effect } from './reactivity.js';\r\nimport type { EffectHandle } from './reactivity.js';\r\nimport { Injector } from './di.js';\r\nimport type { Provider } from './di.js';\r\n\r\n// ---------------------------------------------------------------------------\r\n// Types\r\n// ---------------------------------------------------------------------------\r\n\r\nexport interface ComponentContext {\r\n  injector: Injector;\r\n  effects: EffectHandle[];\r\n  children: ComponentContext[];\r\n}\r\n\r\n// Injected as a compile-time constant by Rolldown `define` in dev mode.\r\n// `typeof` check is intentional — the variable may not be defined at runtime.\r\ndeclare const __vorra_dev: boolean | undefined;\r\n\r\n/** Internal record of a mounted component instance, used by HMR swapping. */\r\ninterface HMRInstance {\r\n  node: Node;\r\n  ctx: ComponentContext;\r\n  props: Record<string, () => unknown>;\r\n  parentCtx: ComponentContext;\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// 5.1 Element creation & patching\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Creates a DOM element with the given tag name.\r\n *\r\n * @example\r\n * const div = createElement('div');\r\n */\r\nexport function createElement(tag: string): Element {\r\n  return document.createElement(tag);\r\n}\r\n\r\n/**\r\n * Sets a static attribute on an element.\r\n *\r\n * @example\r\n * setAttr(el, 'class', 'container');\r\n */\r\nexport function setAttr(el: Element, name: string, value: string): void {\r\n  el.setAttribute(name, value);\r\n}\r\n\r\n/**\r\n * Sets a DOM property directly (e.g. value, checked, disabled).\r\n *\r\n * @example\r\n * setProp(input, 'value', 'hello');\r\n */\r\nexport function setProp(el: Element, name: string, value: unknown): void {\r\n  (el as unknown as Record<string, unknown>)[name] = value;\r\n}\r\n\r\n/**\r\n * Attaches an event listener and returns an EffectHandle to remove it.\r\n *\r\n * @example\r\n * const handle = listen(btn, 'click', () => count.update(n => n + 1));\r\n * handle.destroy(); // removes listener\r\n */\r\nexport function listen(\r\n  el: Element,\r\n  event: string,\r\n  handler: EventListener\r\n): EffectHandle {\r\n  el.addEventListener(event, handler);\r\n  return {\r\n    destroy() {\r\n      el.removeEventListener(event, handler);\r\n    },\r\n  };\r\n}\r\n\r\n/**\r\n * Inserts a child node into a parent, optionally before an anchor node.\r\n *\r\n * @example\r\n * insert(container, textNode);\r\n * insert(list, item, anchor); // insert before anchor\r\n */\r\nexport function insert(parent: Node, child: Node, anchor?: Node | null): void {\r\n  parent.insertBefore(child, anchor ?? null);\r\n}\r\n\r\n/**\r\n * Removes a node from the DOM.\r\n *\r\n * @example\r\n * remove(el);\r\n */\r\nexport function remove(node: Node): void {\r\n  node.parentNode?.removeChild(node);\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// 5.2 Reactive bindings\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Binds a getter to a Text node's content. The text updates surgically\r\n * whenever the getter's signal dependencies change.\r\n *\r\n * @example\r\n * const t = document.createTextNode('');\r\n * bindText(t, () => String(count()));\r\n */\r\nexport function bindText(node: Text, getter: () => string): EffectHandle {\r\n  return effect(() => {\r\n    node.nodeValue = getter();\r\n  });\r\n}\r\n\r\n/**\r\n * Binds a getter to an element attribute. When the getter returns `null`,\r\n * the attribute is removed.\r\n *\r\n * @example\r\n * bindAttr(el, 'disabled', () => isDisabled() ? '' : null);\r\n */\r\nexport function bindAttr(\r\n  el: Element,\r\n  name: string,\r\n  getter: () => string | null\r\n): EffectHandle {\r\n  return effect(() => {\r\n    const value = getter();\r\n    if (value === null) {\r\n      el.removeAttribute(name);\r\n    } else {\r\n      el.setAttribute(name, value);\r\n    }\r\n  });\r\n}\r\n\r\n/**\r\n * Binds a getter to a DOM property. Updates the property directly whenever\r\n * the getter's signal dependencies change.\r\n *\r\n * @example\r\n * bindProp(input, 'value', () => name());\r\n */\r\nexport function bindProp(\r\n  el: Element,\r\n  name: string,\r\n  getter: () => unknown\r\n): EffectHandle {\r\n  return effect(() => {\r\n    (el as unknown as Record<string, unknown>)[name] = getter();\r\n  });\r\n}\r\n\r\n/**\r\n * Binds a getter to element visibility. When the getter returns `false`,\r\n * `display: none` is applied; otherwise the inline style is cleared.\r\n *\r\n * @example\r\n * bindShow(el, () => isVisible());\r\n */\r\nexport function bindShow(el: Element, getter: () => boolean): EffectHandle {\r\n  return effect(() => {\r\n    (el as HTMLElement).style.display = getter() ? '' : 'none';\r\n  });\r\n}\r\n\r\n/**\r\n * Binds a getter to a set of CSS classes. Each key in the record is a class\r\n * name; when the value is `true` the class is added, when `false` it is\r\n * removed. Classes not in the record are left untouched.\r\n *\r\n * @example\r\n * bindClass(el, () => ({ active: isActive(), disabled: isDisabled() }));\r\n */\r\nexport function bindClass(\r\n  el: Element,\r\n  getter: () => Record<string, boolean>\r\n): EffectHandle {\r\n  let prevClasses: Record<string, boolean> = {};\r\n\r\n  return effect(() => {\r\n    const next = getter();\r\n\r\n    // Remove classes that were previously active but are no longer present or are now false.\r\n    for (const name of Object.keys(prevClasses)) {\r\n      if (prevClasses[name] === true && !next[name]) {\r\n        el.classList.remove(name);\r\n      }\r\n    }\r\n\r\n    // Add/remove based on current values.\r\n    for (const [name, active] of Object.entries(next)) {\r\n      if (active) {\r\n        el.classList.add(name);\r\n      } else {\r\n        el.classList.remove(name);\r\n      }\r\n    }\r\n\r\n    prevClasses = next;\r\n  });\r\n}\r\n\r\n/**\r\n * Reactively renders a list of items before an anchor comment node.\r\n * Each item receives its own `ComponentContext` scoped under `parentCtx`\r\n * so that bindings created inside the item template are properly cleaned\r\n * up whenever the list re-renders.\r\n *\r\n * This is the runtime backing for the `@for` template directive.\r\n *\r\n * @example\r\n * // Generated by: <li @for={item of items()}>…</li>\r\n * const anchor = document.createComment('for');\r\n * insert(container, anchor);\r\n * ctx.effects.push(bindList(anchor, ctx, () => items(), (item, i, itemCtx) => {\r\n *   const li = createElement('li');\r\n *   const t = document.createTextNode('');\r\n *   itemCtx.effects.push(bindText(t, () => item.name));\r\n *   insert(li, t);\r\n *   return li;\r\n * }));\r\n */\r\nexport function bindList<T>(\r\n  anchor: Comment,\r\n  parentCtx: ComponentContext,\r\n  getter: () => T[],\r\n  itemFactory: (item: T, index: number, ctx: ComponentContext) => Node,\r\n): EffectHandle {\r\n  let activeItems: Array<{ node: Node; ctx: ComponentContext }> = [];\r\n\r\n  return effect(() => {\r\n    const list = getter();\r\n    const parent = anchor.parentNode;\r\n    if (!parent) return;\r\n\r\n    // Tear down previous iteration: remove DOM nodes and destroy child contexts.\r\n    for (const { node, ctx } of activeItems) {\r\n      parent.removeChild(node);\r\n      const idx = parentCtx.children.indexOf(ctx);\r\n      if (idx >= 0) parentCtx.children.splice(idx, 1);\r\n      destroyComponent(ctx);\r\n    }\r\n    activeItems = [];\r\n\r\n    // Render each new item and insert it before the anchor.\r\n    for (let i = 0; i < list.length; i++) {\r\n      const itemCtx = createComponent(parentCtx.injector);\r\n      parentCtx.children.push(itemCtx);\r\n      const node = itemFactory(list[i]!, i, itemCtx);\r\n      parent.insertBefore(node, anchor);\r\n      activeItems.push({ node, ctx: itemCtx });\r\n    }\r\n  });\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// 5.3 Component lifecycle\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Creates a ComponentContext scoped to a child injector derived from\r\n * `parentInjector`. The context owns all EffectHandles created during\r\n * the component's lifetime.\r\n *\r\n * @example\r\n * const ctx = createComponent(app, [{ provide: MY_TOKEN, useValue: 42 }]);\r\n */\r\nexport function createComponent(\r\n  parentInjector: Injector,\r\n  providers?: Provider[]\r\n): ComponentContext {\r\n  const injector = parentInjector.createChild(providers ?? []);\r\n  return {\r\n    injector,\r\n    effects: [],\r\n    children: [],\r\n  };\r\n}\r\n\r\n/**\r\n * Tears down a ComponentContext: destroys all child contexts recursively,\r\n * then destroys all owned effects, then destroys the injector.\r\n *\r\n * @example\r\n * destroyComponent(ctx);\r\n */\r\nexport function destroyComponent(ctx: ComponentContext): void {\r\n  // Recursively destroy children first.\r\n  for (const child of ctx.children) {\r\n    destroyComponent(child);\r\n  }\r\n  ctx.children.length = 0;\r\n\r\n  // Destroy all owned effect handles.\r\n  for (const handle of ctx.effects) {\r\n    handle.destroy();\r\n  }\r\n  ctx.effects.length = 0;\r\n\r\n  // Tear down the scoped injector.\r\n  ctx.injector.destroy();\r\n}\r\n\r\n/**\r\n * Mounts a compiled component factory into a container element. The factory\r\n * receives the ComponentContext, builds the DOM subtree, and returns the\r\n * root node which is then appended to the container.\r\n *\r\n * @example\r\n * mountComponent(counterFactory, document.getElementById('app')!, ctx);\r\n */\r\nexport function mountComponent(\r\n  factory: (ctx: ComponentContext, props?: Record<string, () => unknown>) => Node,\r\n  container: Element,\r\n  ctx: ComponentContext\r\n): void {\r\n  const node = factory(ctx);\r\n  container.appendChild(node);\r\n}\r\n\r\n/**\r\n * Instantiates a child component inside a parent's template. Creates a child\r\n * ComponentContext scoped under the parent, registers it for lifecycle\r\n * tracking, invokes the factory with the given props, and returns the root\r\n * DOM node so the caller can insert it into the tree.\r\n *\r\n * Props are always passed as getter functions so both static and reactive\r\n * values share a uniform call-site API: `props['label']()`.\r\n *\r\n * @example\r\n * // In a compiled parent template:\r\n * const _e1 = mountChild(MyButton, ctx, { label: () => 'Click me' });\r\n * insert(_e0, _e1);\r\n */\r\nexport function mountChild(\r\n  factory: (ctx: ComponentContext, props: Record<string, () => unknown>) => Node,\r\n  parentCtx: ComponentContext,\r\n  props: Record<string, () => unknown> = {},\r\n): Node {\r\n  const childCtx = createComponent(parentCtx.injector);\r\n  parentCtx.children.push(childCtx);\r\n  const node = factory(childCtx, props);\r\n\r\n  // Register the instance for HMR swapping when the runtime is active.\r\n  const hmrId = (factory as unknown as Record<string, unknown>)['__hmrId'] as string | undefined;\r\n  if (hmrId) {\r\n    const w = typeof window !== 'undefined' ? (window as unknown as Record<string, unknown>) : null;\r\n    const hmr = w?.['__vorra_hmr'] as { instances?: Map<string, HMRInstance[]> } | undefined;\r\n    if (hmr?.instances) {\r\n      const list = hmr.instances.get(hmrId) ?? [];\r\n      list.push({ node, ctx: childCtx, props, parentCtx });\r\n      hmr.instances.set(hmrId, list);\r\n    }\r\n  }\r\n\r\n  return node;\r\n}\r\n\r\n/**\r\n * Replaces all mounted instances of the component identified by `id` with\r\n * the output of `newFactory`. Called by the HMR client when a `.vorra` chunk\r\n * is hot-updated. Not intended for use in application code.\r\n */\r\nexport function hmrAccept(\r\n  id: string,\r\n  newFactory: (ctx: ComponentContext, props: Record<string, () => unknown>) => Node,\r\n): void {\r\n  const w = typeof window !== 'undefined' ? (window as unknown as Record<string, unknown>) : null;\r\n  const hmr = w?.['__vorra_hmr'] as { instances?: Map<string, HMRInstance[]> } | undefined;\r\n  if (!hmr?.instances) return;\r\n\r\n  const instances = hmr.instances.get(id) ?? [];\r\n  for (const inst of instances) {\r\n    const parent = inst.node.parentNode;\r\n    if (!parent) continue; // component was unmounted — skip\r\n\r\n    const nextSibling = inst.node.nextSibling;\r\n\r\n    // Tear down old component subtree.\r\n    destroyComponent(inst.ctx);\r\n    parent.removeChild(inst.node);\r\n\r\n    // Mount the new factory in its place.\r\n    const newCtx = createComponent(inst.parentCtx.injector);\r\n    const idx = inst.parentCtx.children.indexOf(inst.ctx);\r\n    if (idx >= 0) inst.parentCtx.children[idx] = newCtx;\r\n\r\n    const newNode = newFactory(newCtx, inst.props);\r\n    parent.insertBefore(newNode, nextSibling);\r\n\r\n    // Update the instance record for future HMR swaps.\r\n    inst.node = newNode;\r\n    inst.ctx = newCtx;\r\n  }\r\n}\r\n\r\n// Wire up the HMR runtime on the global `window.__vorra_hmr` object so that\r\n// dynamically-imported component chunks can call `window.__vorra_hmr.accept`.\r\n// This block is compiled away in production builds (Rolldown replaces\r\n// `__vorra_dev` with `false` and tree-shakes the dead code).\r\nif (typeof __vorra_dev !== 'undefined' && __vorra_dev && typeof window !== 'undefined') {\r\n  const w = window as unknown as Record<string, unknown>;\r\n  if (!w['__vorra_hmr']) w['__vorra_hmr'] = {};\r\n  const hmr = w['__vorra_hmr'] as Record<string, unknown>;\r\n  if (!hmr['instances']) hmr['instances'] = new Map<string, HMRInstance[]>();\r\n  hmr['accept'] = hmrAccept;\r\n}\r\n"],"mappings":"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"}

package/dist/index.cjs

@@ -0,0 +1,38 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_reactivity = require("./reactivity.cjs");
+const require_di = require("./di.cjs");
+const require_dom = require("./dom.cjs");
+exports.Inject = require_di.Inject;
+exports.Injectable = require_di.Injectable;
+exports.InjectionToken = require_di.InjectionToken;
+exports.Injector = require_di.Injector;
+exports.batch = require_reactivity.batch;
+exports.bindAttr = require_dom.bindAttr;
+exports.bindClass = require_dom.bindClass;
+exports.bindList = require_dom.bindList;
+exports.bindProp = require_dom.bindProp;
+exports.bindShow = require_dom.bindShow;
+exports.bindText = require_dom.bindText;
+exports.bootstrapApp = require_di.bootstrapApp;
+exports.computed = require_reactivity.computed;
+exports.createComponent = require_dom.createComponent;
+exports.createElement = require_dom.createElement;
+exports.destroyComponent = require_dom.destroyComponent;
+exports.effect = require_reactivity.effect;
+exports.getActiveInjector = require_di.getActiveInjector;
+exports.getRootInjector = require_di.getRootInjector;
+exports.inject = require_di.inject;
+exports.insert = require_dom.insert;
+exports.isSignal = require_reactivity.isSignal;
+exports.listen = require_dom.listen;
+exports.mountChild = require_dom.mountChild;
+exports.mountComponent = require_dom.mountComponent;
+exports.onDestroy = require_di.onDestroy;
+exports.remove = require_dom.remove;
+exports.resetRootInjector = require_di.resetRootInjector;
+exports.runDestroyCallbacks = require_di.runDestroyCallbacks;
+exports.runInContext = require_di.runInContext;
+exports.setAttr = require_dom.setAttr;
+exports.setProp = require_dom.setProp;
+exports.signal = require_reactivity.signal;
+exports.untrack = require_reactivity.untrack;

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export { signal, computed, effect, batch, untrack, isSignal, } from './reactivity.js';
+export type { WritableSignal, ReadonlySignal, ComputedSignal, EffectHandle, Signal, SignalGetter, SignalSetter, } from './reactivity.js';
+export { Injectable, Inject, InjectionToken, Injector, inject, runInContext, bootstrapApp, resetRootInjector, getRootInjector, getActiveInjector, onDestroy, runDestroyCallbacks, } from './di.js';
+export type { Provider, ClassProvider, ValueProvider, FactoryProvider, ExistingProvider, Token, ProvidedIn, InjectableOptions, } from './di.js';
+export { createElement, setAttr, setProp, listen, insert, remove, bindText, bindAttr, bindProp, bindShow, bindClass, createComponent, destroyComponent, mountComponent, mountChild, } from './dom.js';
+export type { ComponentContext } from './dom.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,OAAO,EACL,MAAM,EACN,QAAQ,EACR,MAAM,EACN,KAAK,EACL,OAAO,EACP,QAAQ,GACT,MAAM,iBAAiB,CAAC;AAEzB,YAAY,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,YAAY,EACZ,MAAM,EACN,YAAY,EACZ,YAAY,GACb,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EACL,UAAU,EACV,MAAM,EACN,cAAc,EACd,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EACjB,SAAS,EACT,mBAAmB,GACpB,MAAM,SAAS,CAAC;AAEjB,YAAY,EACV,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,KAAK,EACL,UAAU,EACV,iBAAiB,GAClB,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,aAAa,EACb,OAAO,EACP,OAAO,EACP,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,GACX,MAAM,UAAU,CAAC;AAElB,YAAY,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC"}

package/dist/index.js

@@ -0,0 +1,4 @@
+import { batch, computed, effect, isSignal, signal, untrack } from "./reactivity.js";
+import { Inject, Injectable, InjectionToken, Injector, bootstrapApp, getActiveInjector, getRootInjector, inject, onDestroy, resetRootInjector, runDestroyCallbacks, runInContext } from "./di.js";
+import { bindAttr, bindClass, bindList, bindProp, bindShow, bindText, createComponent, createElement, destroyComponent, insert, listen, mountChild, mountComponent, remove, setAttr, setProp } from "./dom.js";
+export { Inject, Injectable, InjectionToken, Injector, batch, bindAttr, bindClass, bindList, bindProp, bindShow, bindText, bootstrapApp, computed, createComponent, createElement, destroyComponent, effect, getActiveInjector, getRootInjector, inject, insert, isSignal, listen, mountChild, mountComponent, onDestroy, remove, resetRootInjector, runDestroyCallbacks, runInContext, setAttr, setProp, signal, untrack };

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,gFAAgF;AAChF,2BAA2B;AAC3B,gFAAgF;AAEhF,wBAAwB;AACxB,OAAO,EACL,MAAM,EACN,QAAQ,EACR,MAAM,EACN,KAAK,EACL,OAAO,EACP,QAAQ,GACT,MAAM,iBAAiB,CAAC;AAYzB,uBAAuB;AACvB,OAAO,EACL,UAAU,EACV,MAAM,EACN,cAAc,EACd,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EACjB,SAAS,EACT,mBAAmB,GACpB,MAAM,SAAS,CAAC;AAajB,cAAc;AACd,OAAO,EACL,aAAa,EACb,OAAO,EACP,OAAO,EACP,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,GACX,MAAM,UAAU,CAAC"}