revojs 0.0.14 → 0.0.16

package/dist/html/index.d.ts

@@ -1,5 +1,5 @@
 import { type HtmlAttributes } from "../jsx";
-import { Hooks, Scope, type State, type Value } from "../signals";
+import { type Descriptor, Hooks, Scope, type State, type Value } from "../signals";
 export type TypeOf<T> = {
     (): T;
 };
@@ -45,10 +45,13 @@ 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 context: Map<string, unknown>;
     readonly events: EventOutput<TEvents>;
     readonly attributes: State<AttributeOutput<TAttributes>>;
     readonly shadowRoot: false | ShadowRootInit;
     readonly host?: CustomElement<TEvents, TAttributes>;
+    getContext: <T>(input: string | Descriptor<T>) => T;
+    setContext: <T>(input: string | Descriptor<T>, value: T) => void;
     onMounted: (invoke: (input: HTMLElement) => void | Promise<void>) => void;
     setup: () => Slot | Promise<Slot>;
 }
@@ -56,7 +59,7 @@ export interface ComponentConstructor<TEvents extends Events, TAttributes extend
     $name: string;
     $events: TEvents;
     $attributes: TAttributes;
-    new (input?: Input<TEvents, TAttributes>, host?: CustomElement<TEvents, TAttributes>): Component<TEvents, TAttributes>;
+    new (input?: Input<TEvents, TAttributes>, context?: Map<string, unknown>, host?: CustomElement<TEvents, TAttributes>): Component<TEvents, TAttributes>;
 }
 export interface CustomElement<TEvents extends Events, TAttributes extends Attributes> extends HTMLElement {
     readonly component: Component<TEvents, TAttributes>;
@@ -65,7 +68,7 @@ export interface CustomElementConstructor<TEvents extends Events, TAttributes ex
     new (): CustomElement<TEvents, TAttributes>;
 }
 export declare const isTemplate: (value: object) => value is Template;
-export declare const createElement: <TEvents extends Events, TAttributes extends Attributes>(input: string | ComponentConstructor<TEvents, TAttributes>, attributes?: AttributeInput<TAttributes>, ...children: Array<Slot>) => Slot;
+export declare const createElement: <TEvents extends Events, TAttributes extends Attributes>(input: string | Template | ComponentConstructor<TEvents, TAttributes>, attributes?: AttributeInput<TAttributes>, ...children: Array<Slot>) => Slot;
 export declare const toString: (slot: Slot) => string;
 export declare const toFragment: (nodes: Array<Node>) => DocumentFragment;
 export declare const renderToString: (slot: Slot, context: Map<string, unknown>) => Promise<string>;
@@ -80,5 +83,5 @@ export declare const isServer: () => boolean;
 export declare const preventDefault: (event: Event) => void;
 export declare const stopPropagation: (event: Event) => void;
 export declare const stopImmediatePropagation: (event: Event) => void;
-export declare const MOUNTED_HOOK: import("..").Descriptor<HTMLElement>;
+export declare const MOUNTED_HOOK: Descriptor<HTMLElement>;
 export declare const components: Map<string, ComponentConstructor<Events, Attributes>>;

package/dist/index.js

@@ -125,10 +125,8 @@ var Hooks = class {
 	};
 };
 var Scope = class {
-	context;
 	dispose;
 	constructor() {
-		this.context = new Map();
 		this.dispose = new Array();
 	}
 	stop() {
@@ -209,12 +207,6 @@ 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();
 
@@ -224,7 +216,8 @@ const isTemplate = (value) => {
 	return "tag" in value && "attributes" in value && "children" in value;
 };
 const createElement = (input, attributes, ...children) => {
-	return {
+	if (typeof input === "object") return input;
+	else return {
 		tag: typeof input === "function" ? input.$name : input,
 		attributes: attributes ?? {},
 		children
@@ -261,8 +254,7 @@ const renderToString = async (slot, context) => {
 				}, [slot.tag]).join(" ");
 				const children = await renderToString(slot.children, context);
 				if (customElement) {
-					const element = new customElement(slot.attributes);
-					for (const [input, value] of context) setContext(element.scope, input, value);
+					const element = new customElement(slot.attributes, context);
 					const template = await renderToString(await element.setup(), context);
 					if (element.shadowRoot) {
 						const shadow = await renderToString({
@@ -355,13 +347,15 @@ const defineComponent = (options) => {
 		static $attributes = options.attributes ?? {};
 		scope;
 		hooks;
+		context;
 		events;
 		attributes;
 		shadowRoot;
 		host;
-		constructor(input, host) {
+		constructor(input, context, host) {
 			this.scope = new Scope();
 			this.hooks = new Hooks();
+			this.context = context ?? new Map();
 			this.events = Object.keys(options.events ?? {}).reduce((output, name) => {
 				Reflect.set(output, name, input?.[name], output);
 				return output;
@@ -373,6 +367,12 @@ const defineComponent = (options) => {
 			this.shadowRoot = options.shadowRoot ?? { mode: "open" };
 			this.host = host;
 		}
+		getContext = (input) => {
+			return this.context.get(descriptor(input)) ?? {};
+		};
+		setContext = (input, value) => {
+			this.context.set(descriptor(input), value);
+		};
 		onMounted = (invoke) => {
 			return this.hooks.on(this.scope, MOUNTED_HOOK, invoke);
 		};
@@ -385,7 +385,7 @@ const toCustomElement = (component) => {
 		component;
 		constructor() {
 			super();
-			this.component = new component(void 0, this);
+			this.component = new component(void 0, void 0, this);
 		}
 		async connectedCallback() {
 			const shadow = this.component.shadowRoot ? this.attachShadow(this.component.shadowRoot) : this;
@@ -397,7 +397,7 @@ const toCustomElement = (component) => {
 					detail: value
 				}));
 			}, this.component.events);
-			if (parentNode) for (const [name, value] of parentNode.component.scope.context) setContext(this.component.scope, name, value);
+			if (parentNode) for (const [name, value] of parentNode.component.context) this.component.context.set(name, value);
 			shadow.replaceChildren(await renderToNode(this.component.scope, await this.component.setup()));
 			this.component.hooks.dispatch(MOUNTED_HOOK, this);
 		}
@@ -753,8 +753,8 @@ const RUNTIME_CONTEXT = defineContext("RUNTIME_CONTEXT");
 const Outlet = defineComponent({
 	name: "x-outlet",
 	shadowRoot: false,
-	setup: async ({ scope }) => {
-		const { event } = getContext(scope, RUNTIME_CONTEXT);
+	setup: async ({ scope, getContext }) => {
+		const { event } = getContext(RUNTIME_CONTEXT);
 		const radix = new Radix();
 		const routes = await getRoutes();
 		for (const path in routes) {
@@ -787,4 +787,4 @@ const anchorNavigate = (event) => {
 };
 
 //#endregion
-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 };
+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, 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 };

package/dist/jsx/index.d.ts

@@ -364,4 +364,4 @@ export declare namespace JSX {
 }
 export declare const svgElements: Set<string>;
 export declare const namespace: (tag: string) => "http://www.w3.org/1999/xhtml" | "http://www.w3.org/2000/svg";
-export declare const h: <TEvents extends import("..").Events, TAttributes extends import("..").Attributes>(input: string | import("..").ComponentConstructor<TEvents, TAttributes>, attributes?: import("..").AttributeInput<TAttributes>, ...children: Array<Slot>) => Slot;
+export declare const h: <TEvents extends import("..").Events, TAttributes extends import("..").Attributes>(input: string | import("..").Template | import("..").ComponentConstructor<TEvents, TAttributes>, attributes?: import("..").AttributeInput<TAttributes>, ...children: Array<Slot>) => Slot;

package/dist/jsx/index.js

@@ -7,7 +7,8 @@ function defineHook(description) {
 //#endregion
 //#region src/html/index.ts
 const createElement = (input, attributes, ...children) => {
-	return {
+	if (typeof input === "object") return input;
+	else return {
 		tag: typeof input === "function" ? input.$name : input,
 		attributes: attributes ?? {},
 		children

package/dist/signals/index.d.ts

@@ -12,7 +12,6 @@ export declare class Hooks {
     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();
     stop(): void;
@@ -35,7 +34,5 @@ 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.14",
+    "version": "0.0.16",
     "type": "module",
     "repository": "coverbase/revojs",
     "license": "MIT",