@revojs/vue 0.1.50 → 0.1.51

package/dist/client/index.d.ts

@@ -7,6 +7,7 @@ interface AsyncOptions<T> {
   catch?: (error: T) => void | Promise<void>;
 }
 declare function useScope(): Scope;
+declare function useError(scope?: Scope): ShallowRef<Error>;
 declare function useRouter(): {
   context: ShallowRef<RouterContext<Component>>;
   navigate: (path: string) => void;
@@ -28,6 +29,7 @@ declare function refreshAsync(input?: string | Array<string>): Promise<void[] |
 declare const isServerSideRendering: any;
 declare const REFRESH_ASYNC_HOOK: _$revojs.Descriptor<(names?: Array<string>) => Promise<void>>;
 declare const NAVIGATE_HOOK: _$revojs.Descriptor<_$revojs.Invoke>;
+declare const CLIENT_ERROR_CONTEXT: _$revojs.Descriptor<ShallowRef<Error>>;
 declare const CLIENT_ROUTER_CONTEXT: _$revojs.Descriptor<ShallowRef<RouterContext<Component>>>;
 //#endregion
-export { AsyncOptions, CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, REFRESH_ASYNC_HOOK, isServerSideRendering, refreshAsync, useAsync, useFetch, useRouter, useScope, useState };
+export { AsyncOptions, CLIENT_ERROR_CONTEXT, CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, REFRESH_ASYNC_HOOK, isServerSideRendering, refreshAsync, useAsync, useError, useFetch, useRouter, useScope, useState };

package/dist/client/index.js

@@ -6,6 +6,9 @@ function useScope() {
 	if (scope) return scope;
 	throw new Error();
 }
+function useError(scope = useScope()) {
+	return scope.getContext(CLIENT_ERROR_CONTEXT);
+}
 function useRouter() {
 	const scope = useScope();
 	const context = scope.getContext(CLIENT_ROUTER_CONTEXT);
@@ -86,6 +89,7 @@ async function refreshAsync(input) {
 const isServerSideRendering = import.meta.SERVER_SIDE_RENDERING ?? globalThis?.import?.meta?.SERVER_SIDE_RENDERING;
 const REFRESH_ASYNC_HOOK = defineHook("REFRESH_ASYNC_HOOK");
 const NAVIGATE_HOOK = defineHook("NAVIGATE_HOOK");
+const CLIENT_ERROR_CONTEXT = defineContext("CLIENT_ERROR_CONTEXT");
 const CLIENT_ROUTER_CONTEXT = defineContext("CLIENT_ROUTER_CONTEXT");
 //#endregion
-export { CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, REFRESH_ASYNC_HOOK, isServerSideRendering, refreshAsync, useAsync, useFetch, useRouter, useScope, useState };
+export { CLIENT_ERROR_CONTEXT, CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, REFRESH_ASYNC_HOOK, isServerSideRendering, refreshAsync, useAsync, useError, useFetch, useRouter, useScope, useState };

package/dist/runtime/app.js

@@ -1,9 +1,13 @@
 import Main from "#vue/main";
-import { createApp, createSSRApp } from "vue";
+import { createApp, createSSRApp, warn } from "vue";
 import { isServerSideRendering } from "../client";
 //#region src/runtime/app.ts
 var app_default = async (scope) => {
 	const app = (isServerSideRendering ? createSSRApp(Main) : createApp(Main)).provide("REVOJS_SCOPE", scope);
+	app.config.warnHandler = (message, instance, trace) => {
+		if (message.includes("Invalid vnode type when creating vnode") || message.includes("Component <Anonymous> is missing template or render function")) return;
+		warn(message, instance, trace);
+	};
 	app.config.throwUnhandledErrorInProduction = true;
 	return app;
 };

package/dist/runtime/main.vue

@@ -7,11 +7,12 @@
 <script setup lang="ts">
 import pages from "#pages";
 import { isClient, Router, RouterContext, useUrl } from "revojs";
-import { computed, h, onScopeDispose, shallowRef, type Component } from "vue";
-import { CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, useScope } from "../client";
+import { computed, h, onErrorCaptured, onScopeDispose, shallowRef, type Component } from "vue";
+import { CLIENT_ERROR_CONTEXT, CLIENT_ROUTER_CONTEXT, NAVIGATE_HOOK, useScope } from "../client";
 
 const scope = useScope();
 
+const error = shallowRef<Error>();
 const context = shallowRef<RouterContext<Component>>();
 
 const router = new Router<Component>();
@@ -32,9 +33,14 @@ for (const path in pages) {
 
 const route = computed(() => {
     if (context.value?.route.value) {
+        const route = h(context.value.route.value);
+
         return context.value.hooks.reduceRight(
-            (previous, hook) => h(hook, null, { default: () => previous }),
-            h(context.value.route.value),
+            (previous, hook) =>
+                h(hook, null, {
+                    default: () => (error.value === undefined ? previous : undefined),
+                }),
+            route,
         );
     }
 });
@@ -54,5 +60,12 @@ if (isClient) {
 
 fetch();
 
+scope.setContext(CLIENT_ERROR_CONTEXT, error);
 scope.setContext(CLIENT_ROUTER_CONTEXT, context);
+
+onErrorCaptured((value) => {
+    if (error.value === undefined) {
+        error.value = value;
+    }
+});
 </script>

package/dist/runtime/routes/[...]/get.js

@@ -1,4 +1,4 @@
-import { isServerSideRendering } from "../../../client";
+import { isServerSideRendering, useError } from "../../../client";
 import createApp from "#vue/app";
 import { defineRoute, sendOk, useServer } from "revojs";
 import client from "#client";
@@ -9,10 +9,9 @@ var get_default = defineRoute({ async fetch(scope) {
 	let content = client;
 	if (isServerSideRendering) {
 		const app = await createApp(scope);
-		let exception;
-		app.config.errorHandler = (value) => exception = value;
 		content = content.replace("<!-- APP -->", await renderToString(app));
-		if (exception) throw exception;
+		const error = useError(scope);
+		if (error.value) throw error.value;
 	}
 	const value = JSON.stringify(states).replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
 	return sendOk(scope, content.replace(`<!-- STATES -->`, value));

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@revojs/vue",
-    "version": "0.1.50",
+    "version": "0.1.51",
     "license": "MIT",
     "repository": "tellua/revojs",
     "files": [