revojs 0.0.13 → 0.0.14

package/dist/html/index.d.ts

@@ -1,5 +1,5 @@
 import { type HtmlAttributes } from "../jsx";
-import { Scope, type State, type Value } from "../signals";
+import { Hooks, Scope, type State, type Value } from "../signals";
 export type TypeOf<T> = {
     (): T;
 };
@@ -44,6 +44,7 @@ export interface ComponentOptions<TEvents extends Events, TAttributes extends At
 }
 export interface Component<TEvents extends Events, TAttributes extends Attributes> {
     readonly scope: Scope;
+    readonly hooks: Hooks;
     readonly events: EventOutput<TEvents>;
     readonly attributes: State<AttributeOutput<TAttributes>>;
     readonly shadowRoot: false | ShadowRootInit;

package/dist/index.js

@@ -107,32 +107,30 @@ const namespace = (tag) => {
 
 //#endregion
 //#region src/signals/index.ts
-var Scope = class {
+var Hooks = class {
 	hooks;
-	context;
-	dispose;
 	constructor() {
 		this.hooks = new Map();
-		this.context = new Map();
-		this.dispose = new Array();
 	}
-	on = (input, invoke) => {
+	on = (scope, input, invoke) => {
 		const key = descriptor(input);
 		const invokes = this.hooks.get(key) ?? new Set();
 		invokes.add(invoke);
 		this.hooks.set(key, invokes);
-		return this.dispose.push(() => invokes.delete(invoke));
+		return scope.dispose.push(() => invokes.delete(invoke));
 	};
 	dispatch = (input, value) => {
 		const invokes = this.hooks.get(descriptor(input));
 		if (invokes) for (const invoke of invokes) invoke(value);
 	};
-	getContext = (input) => {
-		return this.context.get(descriptor(input)) ?? {};
-	};
-	setContext = (input, value) => {
-		this.context.set(descriptor(input), value);
-	};
+};
+var Scope = class {
+	context;
+	dispose;
+	constructor() {
+		this.context = new Map();
+		this.dispose = new Array();
+	}
 	stop() {
 		while (this.dispose.length) this.dispose.pop()?.(this);
 	}
@@ -211,6 +209,12 @@ function defineHook(description) {
 function defineContext(description) {
 	return { key: Symbol(description) };
 }
+function getContext(scope, input) {
+	return scope.context.get(descriptor(input)) ?? {};
+}
+function setContext(scope, input, value) {
+	scope.context.set(descriptor(input), value);
+}
 let activeCompute;
 const targets = new WeakMap();
 
@@ -258,7 +262,7 @@ const renderToString = async (slot, context) => {
 				const children = await renderToString(slot.children, context);
 				if (customElement) {
 					const element = new customElement(slot.attributes);
-					for (const [input, value] of context) element.scope.setContext(input, value);
+					for (const [input, value] of context) setContext(element.scope, input, value);
 					const template = await renderToString(await element.setup(), context);
 					if (element.shadowRoot) {
 						const shadow = await renderToString({
@@ -350,12 +354,14 @@ const defineComponent = (options) => {
 		static $events = options.events ?? {};
 		static $attributes = options.attributes ?? {};
 		scope;
+		hooks;
 		events;
 		attributes;
 		shadowRoot;
 		host;
 		constructor(input, host) {
 			this.scope = new Scope();
+			this.hooks = new Hooks();
 			this.events = Object.keys(options.events ?? {}).reduce((output, name) => {
 				Reflect.set(output, name, input?.[name], output);
 				return output;
@@ -368,7 +374,7 @@ const defineComponent = (options) => {
 			this.host = host;
 		}
 		onMounted = (invoke) => {
-			return this.scope.on(MOUNTED_HOOK, invoke);
+			return this.hooks.on(this.scope, MOUNTED_HOOK, invoke);
 		};
 		setup = () => options.setup(this);
 	});
@@ -384,8 +390,6 @@ const toCustomElement = (component) => {
 		async connectedCallback() {
 			const shadow = this.component.shadowRoot ? this.attachShadow(this.component.shadowRoot) : this;
 			const parentNode = getCustomElement(this.parentNode);
-			for (const [name, set] of parentNode?.component.scope.hooks ?? []) for (const invoke of set) this.component.scope.on(name, invoke);
-			for (const [name, value] of parentNode?.component.scope.context ?? []) this.component.scope.setContext(name, value);
 			for (const [name, event] of Object.entries(component.$events)) Reflect.set(this.component.events, name, (value) => {
 				if (value instanceof Event) return;
 				this.dispatchEvent(new CustomEvent(name.substring(2).toLowerCase(), {
@@ -393,9 +397,9 @@ const toCustomElement = (component) => {
 					detail: value
 				}));
 			}, this.component.events);
-			if (parentNode) for (const key in parentNode.component.scope.context) this.component.scope.setContext(key, parentNode.component.scope.context.get(key));
+			if (parentNode) for (const [name, value] of parentNode.component.scope.context) setContext(this.component.scope, name, value);
 			shadow.replaceChildren(await renderToNode(this.component.scope, await this.component.setup()));
-			this.component.scope.dispatch(MOUNTED_HOOK, this);
+			this.component.hooks.dispatch(MOUNTED_HOOK, this);
 		}
 		attributeChangedCallback(name, oldValue, value) {
 			if (value === oldValue) return;
@@ -750,7 +754,7 @@ const Outlet = defineComponent({
 	name: "x-outlet",
 	shadowRoot: false,
 	setup: async ({ scope }) => {
-		const { event } = scope.getContext(RUNTIME_CONTEXT);
+		const { event } = getContext(scope, RUNTIME_CONTEXT);
 		const radix = new Radix();
 		const routes = await getRoutes();
 		for (const path in routes) {
@@ -783,4 +787,4 @@ const anchorNavigate = (event) => {
 };
 
 //#endregion
-export { $fetch, Compute, Handler, MOUNTED_HOOK, Outlet, RUNTIME_CONTEXT, Radix, Scope, activeCompute, anchorNavigate, components, createApp, createCompute, createElement, createEvent, createMemo, createRuntime, createState, defineComponent, defineContext, defineHook, defineRoute, descriptor, fileName, fromValue, getAssets, getCookies, getCustomElement, getGlobalStyles, getMimeType, getRequestUrl, getRoutes, getSetCookies, getVariables, isClient, isServer, isTemplate, markdownToSlot, navigate, preventDefault, registerComponent, renderToNode, renderToString, sendBadRequest, sendHtml, sendJson, sendRedirect, sendText, sendUnauthorized, setCookie, stopImmediatePropagation, stopPropagation, targets, toCustomElement, toFragment, toPath, toString };
+export { $fetch, Compute, Handler, Hooks, MOUNTED_HOOK, Outlet, RUNTIME_CONTEXT, Radix, Scope, activeCompute, anchorNavigate, components, createApp, createCompute, createElement, createEvent, createMemo, createRuntime, createState, defineComponent, defineContext, defineHook, defineRoute, descriptor, fileName, fromValue, getAssets, getContext, getCookies, getCustomElement, getGlobalStyles, getMimeType, getRequestUrl, getRoutes, getSetCookies, getVariables, isClient, isServer, isTemplate, markdownToSlot, navigate, preventDefault, registerComponent, renderToNode, renderToString, sendBadRequest, sendHtml, sendJson, sendRedirect, sendText, sendUnauthorized, setContext, setCookie, stopImmediatePropagation, stopPropagation, targets, toCustomElement, toFragment, toPath, toString };

package/dist/signals/index.d.ts

@@ -5,15 +5,16 @@ export interface State<T> {
 export type Descriptor<T> = {
     key: symbol;
 };
-export declare class Scope {
+export declare class Hooks {
     readonly hooks: Map<string, Set<(value: any) => unknown>>;
+    constructor();
+    on: <T>(scope: Scope, input: string | Descriptor<T>, invoke: (value: T) => unknown) => number;
+    dispatch: <T>(input: string | Descriptor<T>, value: T) => void;
+}
+export declare class Scope {
     readonly context: Map<string, unknown>;
     readonly dispose: Array<(scope: Scope) => void>;
     constructor();
-    on: <T>(input: string | Descriptor<T>, invoke: (value: T) => unknown) => number;
-    dispatch: <T>(input: string | Descriptor<T>, value: T) => void;
-    getContext: <T>(input: string | Descriptor<T>) => T;
-    setContext: <T>(input: string | Descriptor<T>, value: T) => void;
     stop(): void;
 }
 export declare class Compute<T = void> extends Scope {
@@ -34,5 +35,7 @@ export declare function fromValue<T>(value: Value<T>): T;
 export declare function descriptor<T>(descriptor: string | Descriptor<T>): string;
 export declare function defineHook<T>(description?: string | number): Descriptor<T>;
 export declare function defineContext<T>(description?: string | number): Descriptor<T>;
+export declare function getContext<T>(scope: Scope, input: string | Descriptor<T>): T;
+export declare function setContext<T>(scope: Scope, input: string | Descriptor<T>, value: T): void;
 export declare let activeCompute: Compute | undefined;
 export declare const targets: WeakMap<object, Map<string | symbol, Set<Compute<void>>>>;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "revojs",
-    "version": "0.0.13",
+    "version": "0.0.14",
     "type": "module",
     "repository": "coverbase/revojs",
     "license": "MIT",