@praxisjs/runtime 0.1.0 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,33 @@
 # @praxisjs/runtime
 
+## 0.2.0
+
+### Minor Changes
+
+- bb0d4f8: **Refactor decorator system and component architecture across PraxisJS packages**
+
+  - Replaced legacy decorator signatures (`constructor`, `target`, `propertyKey`, method descriptor) with the standard TC39 decorator context API (`ClassDecoratorContext`, `ClassFieldDecoratorContext`, `ClassMethodDecoratorContext`) across `@praxisjs/decorators`, `@praxisjs/store`, `@praxisjs/concurrent`, `@praxisjs/router`, `@praxisjs/motion`, `@praxisjs/di`, and `@praxisjs/fsm`.
+  - Introduced `StatefulComponent` and `StatelessComponent` as the new base classes, replacing the deprecated `BaseComponent`/`Function Component` pattern, across `@praxisjs/core`, `@praxisjs/runtime`, `@praxisjs/devtools`, and templates.
+  - Implemented core rendering functionality in `@praxisjs/runtime` (`mountChildren`, `mountComponent`, reactive scope management) and removed the deprecated `renderer.ts`.
+  - Refactored `@praxisjs/jsx` to delegate rendering to `@praxisjs/runtime` and improved type safety with `flattenChildren` and `isComponent` utilities.
+  - Updated internal module structure with new `internal` exports in `package.json` files for shared utilities and types.
+  - Removed `experimentalDecorators`/`emitDecoratorMetadata` from `tsconfig.json` in favor of native decorator support.
+
+### Patch Changes
+
+- Updated dependencies [bb0d4f8]
+  - @praxisjs/decorators@0.3.0
+  - @praxisjs/core@0.3.0
+  - @praxisjs/shared@0.2.0
+
+## 0.1.1
+
+### Patch Changes
+
+- Updated dependencies [f48dbc4]
+  - @praxisjs/core@0.2.0
+  - @praxisjs/decorators@0.2.0
+
 ## 0.1.0
 
 ### Minor Changes

package/dist/children.d.ts

@@ -0,0 +1,3 @@
+import type { Scope } from "./scope";
+export declare function mountChildren(parent: Node, children: unknown, scope: Scope): void;
+//# sourceMappingURL=children.d.ts.map

package/dist/children.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"children.d.ts","sourceRoot":"","sources":["../src/children.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAErC,wBAAgB,aAAa,CAC3B,MAAM,EAAE,IAAI,EACZ,QAAQ,EAAE,OAAO,EACjB,KAAK,EAAE,KAAK,GACX,IAAI,CAwBN"}

package/dist/children.js

@@ -0,0 +1,24 @@
+import { mountReactive } from "./reactive";
+export function mountChildren(parent, children, scope) {
+    if (children === null || children === undefined || children === false)
+        return;
+    if (typeof children === "string" || typeof children === "number") {
+        parent.appendChild(document.createTextNode(String(children)));
+        return;
+    }
+    if (typeof children === "function") {
+        mountReactive(parent, children, scope);
+        return;
+    }
+    if (children instanceof Node) {
+        parent.appendChild(children);
+        return;
+    }
+    if (Array.isArray(children)) {
+        for (const child of children) {
+            mountChildren(parent, child, scope);
+        }
+        return;
+    }
+}
+//# sourceMappingURL=children.js.map

package/dist/children.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"children.js","sourceRoot":"","sources":["../src/children.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAI3C,MAAM,UAAU,aAAa,CAC3B,MAAY,EACZ,QAAiB,EACjB,KAAY;IAEZ,IAAI,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK;QAAE,OAAO;IAE9E,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;QACjE,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QAC9D,OAAO;IACT,CAAC;IAED,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;QACnC,aAAa,CAAC,MAAM,EAAE,QAAyB,EAAE,KAAK,CAAC,CAAC;QACxD,OAAO;IACT,CAAC;IAED,IAAI,QAAQ,YAAY,IAAI,EAAE,CAAC;QAC7B,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;QAC7B,OAAO;IACT,CAAC;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC5B,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC7B,aAAa,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACtC,CAAC;QACD,OAAO;IACT,CAAC;AACH,CAAC"}

package/dist/component.d.ts

@@ -0,0 +1,5 @@
+import { isComponent, type ComponentConstructor } from "@praxisjs/shared/internal";
+import type { Scope } from "./scope";
+export declare function mountComponent(ctor: ComponentConstructor, props: Record<string, unknown>, parentScope: Scope): Node[];
+export { isComponent };
+//# sourceMappingURL=component.d.ts.map

package/dist/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,KAAK,oBAAoB,EAAG,MAAM,2BAA2B,CAAC;AAKpF,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAErC,wBAAgB,cAAc,CAC5B,IAAI,EAAE,oBAAoB,EAC1B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,WAAW,EAAE,KAAK,GACjB,IAAI,EAAE,CA6CR;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/component.js

@@ -0,0 +1,42 @@
+import { initSlots } from "@praxisjs/decorators";
+import { isComponent } from "@praxisjs/shared/internal";
+import { mountChildren } from "./children";
+import { runInScope } from "./context";
+export function mountComponent(ctor, props, parentScope) {
+    const scope = parentScope.fork();
+    const instance = new ctor({ ...props });
+    const rawChildren = props.children;
+    if (rawChildren != null) {
+        initSlots(instance, rawChildren);
+    }
+    const start = document.createComment(`[${ctor.name}]`);
+    const end = document.createComment(`[/${ctor.name}]`);
+    // Expose anchor so decorators like @Virtual can find the parent element
+    instance._anchor = end;
+    instance.onBeforeMount?.();
+    const container = document.createDocumentFragment();
+    container.appendChild(start);
+    let dom = null;
+    runInScope(scope, () => {
+        try {
+            dom = instance.render();
+        }
+        catch (e) {
+            instance.onError?.(e instanceof Error ? e : new Error(String(e)));
+        }
+    });
+    mountChildren(container, dom, scope);
+    container.appendChild(end);
+    queueMicrotask(() => {
+        instance._mounted = true;
+        instance.onMount?.();
+    });
+    scope.add(() => {
+        instance.onUnmount?.();
+        instance._mounted = false;
+    });
+    // Return the nodes from the fragment as an array so the caller can append them
+    return Array.from(container.childNodes);
+}
+export { isComponent };
+//# sourceMappingURL=component.js.map

package/dist/component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.js","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,WAAW,EAA8B,MAAM,2BAA2B,CAAC;AAEpF,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAIvC,MAAM,UAAU,cAAc,CAC5B,IAA0B,EAC1B,KAA8B,EAC9B,WAAkB;IAElB,MAAM,KAAK,GAAG,WAAW,CAAC,IAAI,EAAE,CAAC;IAEjC,MAAM,QAAQ,GAAG,IAAI,IAAI,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;IAExC,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ,CAAC;IACnC,IAAI,WAAW,IAAI,IAAI,EAAE,CAAC;QACxB,SAAS,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;IACnC,CAAC;IAED,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;IACvD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;IAEtD,wEAAwE;IACxE,QAAQ,CAAC,OAAO,GAAG,GAAG,CAAC;IAEvB,QAAQ,CAAC,aAAa,EAAE,EAAE,CAAC;IAE3B,MAAM,SAAS,GAAG,QAAQ,CAAC,sBAAsB,EAAE,CAAC;IACpD,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAE7B,IAAI,GAAG,GAAyB,IAAI,CAAC;IACrC,UAAU,CAAC,KAAK,EAAE,GAAG,EAAE;QACrB,IAAI,CAAC;YACH,GAAG,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC;QAC1B,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACpE,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,aAAa,CAAC,SAAS,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;IACrC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAE3B,cAAc,CAAC,GAAG,EAAE;QAClB,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC;QACzB,QAAQ,CAAC,OAAO,EAAE,EAAE,CAAC;IACvB,CAAC,CAAC,CAAC;IAEH,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,SAAS,EAAE,EAAE,CAAC;QACvB,QAAQ,CAAC,QAAQ,GAAG,KAAK,CAAC;IAC5B,CAAC,CAAC,CAAC;IAEH,+EAA+E;IAC/E,OAAO,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;AAC1C,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/context.d.ts

@@ -0,0 +1,4 @@
+import type { Scope } from "./scope";
+export declare function getCurrentScope(): Scope;
+export declare function runInScope<T>(scope: Scope, fn: () => T): T;
+//# sourceMappingURL=context.d.ts.map

package/dist/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAIrC,wBAAgB,eAAe,IAAI,KAAK,CAOvC;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,CAAC,GAAG,CAAC,CAQ1D"}

package/dist/context.js

@@ -0,0 +1,18 @@
+let _currentScope = null;
+export function getCurrentScope() {
+    if (!_currentScope) {
+        throw new Error("[PraxisJS] jsx() called outside of a render context. Make sure to call render() with a factory function.");
+    }
+    return _currentScope;
+}
+export function runInScope(scope, fn) {
+    const prev = _currentScope;
+    _currentScope = scope;
+    try {
+        return fn();
+    }
+    finally {
+        _currentScope = prev;
+    }
+}
+//# sourceMappingURL=context.js.map

package/dist/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AAEA,IAAI,aAAa,GAAiB,IAAI,CAAC;AAEvC,MAAM,UAAU,eAAe;IAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CACb,0GAA0G,CAC3G,CAAC;IACJ,CAAC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,UAAU,CAAI,KAAY,EAAE,EAAW;IACrD,MAAM,IAAI,GAAG,aAAa,CAAC;IAC3B,aAAa,GAAG,KAAK,CAAC;IACtB,IAAI,CAAC;QACH,OAAO,EAAE,EAAE,CAAC;IACd,CAAC;YAAS,CAAC;QACT,aAAa,GAAG,IAAI,CAAC;IACvB,CAAC;AACH,CAAC"}

package/dist/dom/constants.d.ts

@@ -0,0 +1,5 @@
+export declare const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
+export declare const SVG_TAGS: Set<string>;
+export declare const EVENT_MAP: Record<string, string>;
+export declare const VALUE_PROPS: Set<string>;
+//# sourceMappingURL=constants.d.ts.map

package/dist/dom/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/dom/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa,+BAA+B,CAAC;AAE1D,eAAO,MAAM,QAAQ,aA2BnB,CAAC;AAEH,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA6B5C,CAAC;AAEF,eAAO,MAAM,WAAW,aAAwD,CAAC"}

package/dist/dom/constants.js

@@ -0,0 +1,61 @@
+export const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
+export const SVG_TAGS = new Set([
+    "svg",
+    "path",
+    "circle",
+    "rect",
+    "line",
+    "polyline",
+    "polygon",
+    "ellipse",
+    "text",
+    "g",
+    "defs",
+    "use",
+    "symbol",
+    "marker",
+    "clipPath",
+    "mask",
+    "pattern",
+    "image",
+    "linearGradient",
+    "radialGradient",
+    "stop",
+    "filter",
+    "feGaussianBlur",
+    "tspan",
+    "textPath",
+    "foreignObject",
+]);
+export const EVENT_MAP = {
+    onClick: "click",
+    onDblClick: "dblclick",
+    onChange: "change",
+    onInput: "input",
+    onSubmit: "submit",
+    onReset: "reset",
+    onKeyDown: "keydown",
+    onKeyUp: "keyup",
+    onKeyPress: "keypress",
+    onFocus: "focus",
+    onBlur: "blur",
+    onMouseDown: "mousedown",
+    onMouseUp: "mouseup",
+    onMouseEnter: "mouseenter",
+    onMouseLeave: "mouseleave",
+    onMouseMove: "mousemove",
+    onContextMenu: "contextmenu",
+    onScroll: "scroll",
+    onWheel: "wheel",
+    onDragStart: "dragstart",
+    onDragEnd: "dragend",
+    onDragOver: "dragover",
+    onDrop: "drop",
+    onTouchStart: "touchstart",
+    onTouchEnd: "touchend",
+    onTouchMove: "touchmove",
+    onAnimationEnd: "animationend",
+    onTransitionEnd: "transitionend",
+};
+export const VALUE_PROPS = new Set(["checked", "value", "disabled", "selected"]);
+//# sourceMappingURL=constants.js.map

package/dist/dom/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/dom/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG,4BAA4B,CAAC;AAE1D,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC;IAC9B,KAAK;IACL,MAAM;IACN,QAAQ;IACR,MAAM;IACN,MAAM;IACN,UAAU;IACV,SAAS;IACT,SAAS;IACT,MAAM;IACN,GAAG;IACH,MAAM;IACN,KAAK;IACL,QAAQ;IACR,QAAQ;IACR,UAAU;IACV,MAAM;IACN,SAAS;IACT,OAAO;IACP,gBAAgB;IAChB,gBAAgB;IAChB,MAAM;IACN,QAAQ;IACR,gBAAgB;IAChB,OAAO;IACP,UAAU;IACV,eAAe;CAChB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,SAAS,GAA2B;IAC/C,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,UAAU;IACtB,QAAQ,EAAE,QAAQ;IAClB,OAAO,EAAE,OAAO;IAChB,QAAQ,EAAE,QAAQ;IAClB,OAAO,EAAE,OAAO;IAChB,SAAS,EAAE,SAAS;IACpB,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,UAAU;IACtB,OAAO,EAAE,OAAO;IAChB,MAAM,EAAE,MAAM;IACd,WAAW,EAAE,WAAW;IACxB,SAAS,EAAE,SAAS;IACpB,YAAY,EAAE,YAAY;IAC1B,YAAY,EAAE,YAAY;IAC1B,WAAW,EAAE,WAAW;IACxB,aAAa,EAAE,aAAa;IAC5B,QAAQ,EAAE,QAAQ;IAClB,OAAO,EAAE,OAAO;IAChB,WAAW,EAAE,WAAW;IACxB,SAAS,EAAE,SAAS;IACpB,UAAU,EAAE,UAAU;IACtB,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,YAAY;IAC1B,UAAU,EAAE,UAAU;IACtB,WAAW,EAAE,WAAW;IACxB,cAAc,EAAE,cAAc;IAC9B,eAAe,EAAE,eAAe;CACjC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC"}

package/dist/dom/create.d.ts

@@ -0,0 +1,2 @@
+export declare function createElement(tag: string): HTMLElement | SVGElement;
+//# sourceMappingURL=create.d.ts.map

package/dist/dom/create.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create.d.ts","sourceRoot":"","sources":["../../src/dom/create.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,CAInE"}

package/dist/dom/create.js

@@ -0,0 +1,7 @@
+import { SVG_NAMESPACE, SVG_TAGS } from "./constants";
+export function createElement(tag) {
+    return SVG_TAGS.has(tag)
+        ? (document.createElementNS(SVG_NAMESPACE, tag))
+        : document.createElement(tag);
+}
+//# sourceMappingURL=create.js.map

package/dist/dom/create.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create.js","sourceRoot":"","sources":["../../src/dom/create.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,UAAU,aAAa,CAAC,GAAW;IACvC,OAAO,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC;QACtB,CAAC,CAAC,CAAC,QAAQ,CAAC,eAAe,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC;QAChD,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;AAClC,CAAC"}

package/dist/dom/events.d.ts

@@ -0,0 +1,3 @@
+import type { Scope } from "../scope";
+export declare function addEvent(el: Element, eventName: string, handler: EventListener, scope: Scope): void;
+//# sourceMappingURL=events.d.ts.map

package/dist/dom/events.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../src/dom/events.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEtC,wBAAgB,QAAQ,CACtB,EAAE,EAAE,OAAO,EACX,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,KAAK,GACX,IAAI,CAGN"}

package/dist/dom/events.js

@@ -0,0 +1,5 @@
+export function addEvent(el, eventName, handler, scope) {
+    el.addEventListener(eventName, handler);
+    scope.add(() => { el.removeEventListener(eventName, handler); });
+}
+//# sourceMappingURL=events.js.map

package/dist/dom/events.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"events.js","sourceRoot":"","sources":["../../src/dom/events.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,QAAQ,CACtB,EAAW,EACX,SAAiB,EACjB,OAAsB,EACtB,KAAY;IAEZ,EAAE,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IACxC,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACnE,CAAC"}

package/dist/dom/props.d.ts

@@ -0,0 +1,3 @@
+import type { Scope } from "../scope";
+export declare function applyProp(el: Element, key: string, value: unknown, scope: Scope): void;
+//# sourceMappingURL=props.d.ts.map

package/dist/dom/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/dom/props.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AA+CtC,wBAAgB,SAAS,CACvB,EAAE,EAAE,OAAO,EACX,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,OAAO,EACd,KAAK,EAAE,KAAK,GACX,IAAI,CAuBN"}

package/dist/dom/props.js

@@ -0,0 +1,72 @@
+import { EVENT_MAP, VALUE_PROPS } from "./constants";
+import { addEvent } from "./events";
+function applyClass(el, value) {
+    if (value === null || value === undefined) {
+        el.removeAttribute("class");
+    }
+    else {
+        // eslint-disable-next-line @typescript-eslint/no-base-to-string
+        el.setAttribute("class", String(value));
+    }
+}
+function applyStyle(el, value) {
+    if (value === null || value === undefined) {
+        el.removeAttribute("style");
+    }
+    else if (typeof value === "object") {
+        const htmlEl = el;
+        htmlEl.removeAttribute("style");
+        Object.assign(htmlEl.style, value);
+    }
+    else {
+        // eslint-disable-next-line @typescript-eslint/no-base-to-string
+        el.setAttribute("style", String(value));
+    }
+}
+function applyAttr(el, key, value) {
+    if (value === false || value === null || value === undefined) {
+        el.removeAttribute(key);
+    }
+    else if (value === true) {
+        el.setAttribute(key, "");
+    }
+    else {
+        // eslint-disable-next-line @typescript-eslint/no-base-to-string
+        el.setAttribute(key, String(value));
+    }
+}
+function setProp(el, key, value) {
+    if (key === "class" || key === "className") {
+        applyClass(el, value);
+    }
+    else if (key === "style") {
+        applyStyle(el, value);
+    }
+    else if (VALUE_PROPS.has(key)) {
+        el[key] = value;
+    }
+    else {
+        applyAttr(el, key, value);
+    }
+}
+export function applyProp(el, key, value, scope) {
+    const normalizedKey = key === "htmlFor" ? "for" : key;
+    if (normalizedKey === "key" || normalizedKey === "children")
+        return;
+    if (normalizedKey === "ref") {
+        value(el);
+        return;
+    }
+    if (normalizedKey in EVENT_MAP) {
+        addEvent(el, EVENT_MAP[normalizedKey], value, scope);
+        return;
+    }
+    if (typeof value === "function") {
+        scope.effect(() => {
+            setProp(el, normalizedKey, value());
+        });
+        return;
+    }
+    setProp(el, normalizedKey, value);
+}
+//# sourceMappingURL=props.js.map

package/dist/dom/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","sourceRoot":"","sources":["../../src/dom/props.ts"],"names":[],"mappings":"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"}

package/dist/element.d.ts

@@ -0,0 +1,3 @@
+import type { Scope } from "./scope";
+export declare function mountElement(tag: string, props: Record<string, unknown>, scope: Scope): HTMLElement | SVGElement;
+//# sourceMappingURL=element.d.ts.map

package/dist/element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["../src/element.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAErC,wBAAgB,YAAY,CAC1B,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,KAAK,EAAE,KAAK,GACX,WAAW,GAAG,UAAU,CAa1B"}

package/dist/element.js

@@ -0,0 +1,16 @@
+import { mountChildren } from "./children";
+import { createElement } from "./dom/create";
+import { applyProp } from "./dom/props";
+export function mountElement(tag, props, scope) {
+    const el = createElement(tag);
+    for (const [key, val] of Object.entries(props)) {
+        if (key === "children")
+            continue;
+        applyProp(el, key, val, scope);
+    }
+    if (props.children !== undefined) {
+        mountChildren(el, props.children, scope);
+    }
+    return el;
+}
+//# sourceMappingURL=element.js.map

package/dist/element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.js","sourceRoot":"","sources":["../src/element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAIxC,MAAM,UAAU,YAAY,CAC1B,GAAW,EACX,KAA8B,EAC9B,KAAY;IAEZ,MAAM,EAAE,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IAE9B,KAAK,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QAC/C,IAAI,GAAG,KAAK,UAAU;YAAE,SAAS;QACjC,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;IACjC,CAAC;IAED,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE,CAAC;QACjC,aAAa,CAAC,EAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC;IAED,OAAO,EAAE,CAAC;AACZ,CAAC"}

package/dist/index.d.ts

@@ -1,2 +1,15 @@
-export { render } from "./renderer";
+/**
+ * Renders a component tree into a container element.
+ *
+ * The factory function is called once inside the root scope,
+ * so `jsx()` can access the current scope via `getCurrentScope()`.
+ *
+ * @example
+ * render(() => <App />, document.getElementById('app'));
+ */
+export declare function render(factory: () => Node | Node[] | null, container: HTMLElement): () => void;
+export { Scope } from "./scope";
+export { runInScope, getCurrentScope } from "./context";
+export { mountElement } from "./element";
+export { mountComponent } from "./component";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CACpB,OAAO,EAAE,MAAM,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,EACnC,SAAS,EAAE,WAAW,GACrB,MAAM,IAAI,CAcZ;AAED,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/index.js

@@ -1,2 +1,29 @@
-export { render } from "./renderer";
+import { mountChildren } from "./children";
+import { runInScope } from "./context";
+import { Scope } from "./scope";
+/**
+ * Renders a component tree into a container element.
+ *
+ * The factory function is called once inside the root scope,
+ * so `jsx()` can access the current scope via `getCurrentScope()`.
+ *
+ * @example
+ * render(() => <App />, document.getElementById('app'));
+ */
+export function render(factory, container) {
+    const rootScope = new Scope();
+    container.innerHTML = "";
+    runInScope(rootScope, () => {
+        const result = factory();
+        mountChildren(container, result, rootScope);
+    });
+    return () => {
+        rootScope.dispose();
+        container.innerHTML = "";
+    };
+}
+export { Scope } from "./scope";
+export { runInScope, getCurrentScope } from "./context";
+export { mountElement } from "./element";
+export { mountComponent } from "./component";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC;;;;;;;;GAQG;AACH,MAAM,UAAU,MAAM,CACpB,OAAmC,EACnC,SAAsB;IAEtB,MAAM,SAAS,GAAG,IAAI,KAAK,EAAE,CAAC;IAE9B,SAAS,CAAC,SAAS,GAAG,EAAE,CAAC;IAEzB,UAAU,CAAC,SAAS,EAAE,GAAG,EAAE;QACzB,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC;QACzB,aAAa,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,EAAE;QACV,SAAS,CAAC,OAAO,EAAE,CAAC;QACpB,SAAS,CAAC,SAAS,GAAG,EAAE,CAAC;IAC3B,CAAC,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/reactive.d.ts

@@ -0,0 +1,3 @@
+import type { Scope } from "./scope";
+export declare function mountReactive(parent: Node, fn: () => unknown, parentScope: Scope): void;
+//# sourceMappingURL=reactive.d.ts.map

package/dist/reactive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactive.d.ts","sourceRoot":"","sources":["../src/reactive.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAYrC,wBAAgB,aAAa,CAC3B,MAAM,EAAE,IAAI,EACZ,EAAE,EAAE,MAAM,OAAO,EACjB,WAAW,EAAE,KAAK,GACjB,IAAI,CA0BN"}

package/dist/reactive.js

@@ -0,0 +1,35 @@
+import { runInScope } from "./context";
+function normalizeToNodes(value) {
+    if (value === null || value === undefined || value === false)
+        return [];
+    if (value instanceof Node)
+        return [value];
+    if (Array.isArray(value))
+        return value.flatMap(normalizeToNodes);
+    if (typeof value === "string" || typeof value === "number") {
+        return [document.createTextNode(String(value))];
+    }
+    return [];
+}
+export function mountReactive(parent, fn, parentScope) {
+    const end = document.createComment("reactive");
+    parent.appendChild(end);
+    let currentNodes = [];
+    let childScope = parentScope.fork();
+    parentScope.effect(() => {
+        childScope.dispose();
+        childScope = parentScope.fork();
+        for (const n of currentNodes) {
+            n.parentNode?.removeChild(n);
+        }
+        currentNodes = [];
+        const result = runInScope(childScope, fn);
+        const newNodes = normalizeToNodes(result);
+        for (const n of newNodes) {
+            parent.insertBefore(n, end);
+        }
+        currentNodes = newNodes;
+    });
+    parentScope.add(() => { childScope.dispose(); });
+}
+//# sourceMappingURL=reactive.js.map

package/dist/reactive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactive.js","sourceRoot":"","sources":["../src/reactive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAIvC,SAAS,gBAAgB,CAAC,KAAc;IACtC,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,KAAK;QAAE,OAAO,EAAE,CAAC;IACxE,IAAI,KAAK,YAAY,IAAI;QAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC1C,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;QAAE,OAAO,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;IACjE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QAC3D,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAClD,CAAC;IACD,OAAO,EAAE,CAAC;AACZ,CAAC;AAED,MAAM,UAAU,aAAa,CAC3B,MAAY,EACZ,EAAiB,EACjB,WAAkB;IAElB,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAC/C,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAExB,IAAI,YAAY,GAAW,EAAE,CAAC;IAC9B,IAAI,UAAU,GAAG,WAAW,CAAC,IAAI,EAAE,CAAC;IAEpC,WAAW,CAAC,MAAM,CAAC,GAAG,EAAE;QACtB,UAAU,CAAC,OAAO,EAAE,CAAC;QACrB,UAAU,GAAG,WAAW,CAAC,IAAI,EAAE,CAAC;QAEhC,KAAK,MAAM,CAAC,IAAI,YAAY,EAAE,CAAC;YAC7B,CAAC,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;QAC/B,CAAC;QACD,YAAY,GAAG,EAAE,CAAC;QAElB,MAAM,MAAM,GAAG,UAAU,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;QAE1C,KAAK,MAAM,CAAC,IAAI,QAAQ,EAAE,CAAC;YACzB,MAAM,CAAC,YAAY,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAC9B,CAAC;QACD,YAAY,GAAG,QAAQ,CAAC;IAC1B,CAAC,CAAC,CAAC;IAEH,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AACnD,CAAC"}

package/dist/scope.d.ts

@@ -0,0 +1,10 @@
+import { effect as coreEffect } from "@praxisjs/core/internal";
+import type { Cleanup } from "@praxisjs/shared/internal";
+export declare class Scope {
+    #private;
+    effect(fn: Parameters<typeof coreEffect>[0]): void;
+    add(cleanup: Cleanup): void;
+    fork(): Scope;
+    dispose(): void;
+}
+//# sourceMappingURL=scope.d.ts.map

package/dist/scope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scope.d.ts","sourceRoot":"","sources":["../src/scope.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAEzD,qBAAa,KAAK;;IAGhB,MAAM,CAAC,EAAE,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;IAIlD,GAAG,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;IAI3B,IAAI,IAAI,KAAK;IAMb,OAAO,IAAI,IAAI;CAIhB"}

package/dist/scope.js

@@ -0,0 +1,20 @@
+import { effect as coreEffect } from "@praxisjs/core/internal";
+export class Scope {
+    #cleanups = [];
+    effect(fn) {
+        this.#cleanups.push(coreEffect(fn));
+    }
+    add(cleanup) {
+        this.#cleanups.push(cleanup);
+    }
+    fork() {
+        const child = new Scope();
+        this.#cleanups.push(() => { child.dispose(); });
+        return child;
+    }
+    dispose() {
+        this.#cleanups.forEach((fn) => { fn(); });
+        this.#cleanups = [];
+    }
+}
+//# sourceMappingURL=scope.js.map

package/dist/scope.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scope.js","sourceRoot":"","sources":["../src/scope.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAG/D,MAAM,OAAO,KAAK;IAChB,SAAS,GAAc,EAAE,CAAC;IAE1B,MAAM,CAAC,EAAoC;QACzC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC;IACtC,CAAC;IAED,GAAG,CAAC,OAAgB;QAClB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC/B,CAAC;IAED,IAAI;QACF,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;QAC1B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QAChD,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAO;QACL,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1C,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACtB,CAAC;CACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@praxisjs/runtime",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -14,10 +14,9 @@
     "typescript": "^5.9.3"
   },
   "dependencies": {
-    "@praxisjs/core": "0.1.0",
-    "@praxisjs/decorators": "0.1.0",
-    "@praxisjs/jsx": "0.1.0",
-    "@praxisjs/shared": "0.1.0"
+    "@praxisjs/decorators": "0.3.0",
+    "@praxisjs/core": "0.3.0",
+    "@praxisjs/shared": "0.2.0"
   },
   "scripts": {
     "build": "tsc",

package/src/children.ts

@@ -0,0 +1,33 @@
+import { mountReactive } from "./reactive";
+
+import type { Scope } from "./scope";
+
+export function mountChildren(
+  parent: Node,
+  children: unknown,
+  scope: Scope,
+): void {
+  if (children === null || children === undefined || children === false) return;
+
+  if (typeof children === "string" || typeof children === "number") {
+    parent.appendChild(document.createTextNode(String(children)));
+    return;
+  }
+
+  if (typeof children === "function") {
+    mountReactive(parent, children as () => unknown, scope);
+    return;
+  }
+
+  if (children instanceof Node) {
+    parent.appendChild(children);
+    return;
+  }
+
+  if (Array.isArray(children)) {
+    for (const child of children) {
+      mountChildren(parent, child, scope);
+    }
+    return;
+  }
+}