@void/vue 0.21.9 → 0.23.0

package/README.md

@@ -36,7 +36,7 @@ Main runtime APIs live at `@void/vue`:
 - `useParams()`
 - `useNavigation()`
 - `useShared()`
-- `useForm()`
+- `Form` and `useForm()`
 - `useIslandForm()`
 - `action()`
 
@@ -114,6 +114,12 @@ Export `ssr = false` from a page's `.server.ts` file to skip server-rendered
 component HTML for that route while still running its loader on the first
 request.
 
+## Form
+
+Use `Form` with `useForm()` to display action and validation errors automatically. It preserves controlled input after a failed submission and announces errors accessibly. Structured usage-limit responses display the application's message and an optional retry time. Submissions are blocked while pending and before that deadline; inputs remain editable and requests are never retried automatically.
+
+`method` selects `post` (the default), `put`, `patch`, or `delete`. Use `renderError` to customize action-error presentation (a snippet in Svelte). Native forms remain available when you manage error presentation yourself.
+
 ## Tests
 
 Shared prefetch-cache tests live in `packages/void/test/unit/prefetch.test.ts`.

package/dist/{index-CD3rUeKP.d.mts → index-vAbysUNV.d.mts}

@@ -1,7 +1,10 @@
+import { ActionClient, NavigationState, VisitOptions, VoidActionError, VoidRouter } from "void/pages-client";
 import { Component } from "vue";
-import { ActionResult, NavigationState, VisitOptions, VoidActionError, VoidRouter } from "void/pages-client";
 import { CloudContextVariables, DeferredState as Deferred, InferProps } from "void";
-import { ActionFormOptions, ActionUrl, ResolveActionBody, ResolveActionParams } from "void/routes";
+import { ActionFormOptions, ActionUrl, ResolveActionBody } from "void/routes";
+//#region src/runtime/form.d.ts
+declare const Form: Component;
+//#endregion
 //#region src/runtime/link.d.ts
 declare const Link: Component;
 //#endregion
@@ -63,19 +66,7 @@ type IslandFormReturn<T extends Record<string, unknown>> = Readonly<{
 declare function useIslandForm<T extends Record<string, unknown>>(defaults: T): IslandFormReturn<T>;
 //#endregion
 //#region src/runtime/action.d.ts
-type ActionMethod = "POST" | "PUT" | "PATCH" | "DELETE";
-type HasParams<U extends string> = [ResolveActionParams<U>] extends [never] ? false : true;
-type ActionOptions<U extends string> = {
-  data?: ResolveActionBody<U>;
-  method?: ActionMethod;
-} & (HasParams<U> extends true ? {
-  params: ResolveActionParams<U>;
-} : {
-  params?: never;
-});
-/** Called during app initialization to store the router instance */
-declare function setActionRouter(router: VoidRouter): void;
-/** Programmatic one-shot page action call with Inertia page update */
-declare function action<U extends ActionUrl & string>(url: U, ...args: HasParams<U> extends true ? [options: ActionOptions<U>] : [options?: ActionOptions<U>]): Promise<ActionResult>;
+declare const action: ActionClient["action"];
+declare const setActionRouter: ActionClient["setActionRouter"];
 //#endregion
-export { useIslandForm as a, useShared as c, Link as d, setActionRouter as i, useParams as l, InferProps as n, useNavigation as o, action as r, useForm as s, Deferred as t, useRouter as u };
+export { useIslandForm as a, useShared as c, Link as d, Form as f, setActionRouter as i, useParams as l, InferProps as n, useNavigation as o, action as r, useForm as s, Deferred as t, useRouter as u };

package/dist/index.d.mts

@@ -1,2 +1,2 @@
-import { a as useIslandForm, c as useShared, d as Link, i as setActionRouter, l as useParams, n as InferProps, o as useNavigation, r as action, s as useForm, t as Deferred, u as useRouter } from "./index-CD3rUeKP.mjs";
-export { type Deferred, type InferProps, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };
+import { a as useIslandForm, c as useShared, d as Link, f as Form, i as setActionRouter, l as useParams, n as InferProps, o as useNavigation, r as action, s as useForm, t as Deferred, u as useRouter } from "./index-vAbysUNV.mjs";
+export { type Deferred, Form, type InferProps, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };

package/dist/index.mjs

@@ -1,2 +1,2 @@
-import { a as useForm, c as useRouter, i as useNavigation, l as Link, n as setActionRouter, o as useShared, r as useIslandForm, s as useParams, t as action } from "./runtime-lFhMSoX1.mjs";
-export { Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };
+import { a as useForm, c as useRouter, i as useNavigation, l as Link, n as setActionRouter, o as useShared, r as useIslandForm, s as useParams, t as action, u as Form } from "./runtime-DU7JTkNy.mjs";
+export { Form, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };

package/dist/runtime/index.d.mts

@@ -1,2 +1,2 @@
-import { a as useIslandForm, c as useShared, d as Link, i as setActionRouter, l as useParams, n as InferProps, o as useNavigation, r as action, s as useForm, t as Deferred, u as useRouter } from "../index-CD3rUeKP.mjs";
-export { type Deferred, type InferProps, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };
+import { a as useIslandForm, c as useShared, d as Link, f as Form, i as setActionRouter, l as useParams, n as InferProps, o as useNavigation, r as action, s as useForm, t as Deferred, u as useRouter } from "../index-vAbysUNV.mjs";
+export { type Deferred, Form, type InferProps, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };

package/dist/runtime/index.mjs

@@ -1,2 +1,2 @@
-import { a as useForm, c as useRouter, i as useNavigation, l as Link, n as setActionRouter, o as useShared, r as useIslandForm, s as useParams, t as action } from "../runtime-lFhMSoX1.mjs";
-export { Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };
+import { a as useForm, c as useRouter, i as useNavigation, l as Link, n as setActionRouter, o as useShared, r as useIslandForm, s as useParams, t as action, u as Form } from "../runtime-DU7JTkNy.mjs";
+export { Form, Link, action, setActionRouter, useForm, useIslandForm, useNavigation, useParams, useRouter, useShared };

package/dist/{runtime-lFhMSoX1.mjs → runtime-DU7JTkNy.mjs}

@@ -1,5 +1,48 @@
+import { VoidActionError, categorizeActionError, createActionClient, formErrorMessage, formRetryMessage, formSubmissionBlocked, idleNavigationState, isAbortError, isEqualFormValue, scheduleFormRetry, ssrProxy, submitAction } from "void/pages-client";
 import { computed, defineComponent, h, inject, onMounted, onUnmounted, reactive, ref, watch } from "vue";
-import { VoidActionError, categorizeActionError, idleNavigationState, isAbortError, isEqualFormValue, ssrProxy, submitAction } from "void/pages-client";
+//#region src/runtime/form.ts
+const Form = defineComponent({
+	name: "VoidForm",
+	inheritAttrs: false,
+	props: {
+		form: {
+			type: Object,
+			required: true
+		},
+		method: {
+			type: String,
+			default: "post"
+		},
+		renderError: Function
+	},
+	setup(props, { attrs, slots }) {
+		const now = ref(Date.now());
+		let cancel = () => {};
+		onMounted(() => watch(() => props.form.error, (error) => {
+			cancel();
+			cancel = scheduleFormRetry(error, () => {
+				now.value = Date.now();
+			});
+		}, { immediate: true }));
+		onUnmounted(() => cancel());
+		return () => {
+			const form = props.form;
+			const message = formErrorMessage(form), retry = formRetryMessage(form.error);
+			return h("form", {
+				...attrs,
+				"aria-busy": form.pending,
+				onSubmit: async (event) => {
+					event.preventDefault();
+					if (!formSubmissionBlocked(form, now.value)) await form[props.method]();
+				}
+			}, [message ? h("div", {
+				role: "alert",
+				"data-void-form-error": ""
+			}, [form.error && props.renderError ? props.renderError(form.error) : message, retry ? h("p", retry) : null]) : null, slots.default?.()]);
+		};
+	}
+});
+//#endregion
 //#region src/runtime/link.ts
 function appendQueryValue(params, key, value) {
 	if (value === null || value === void 0) return false;
@@ -440,30 +483,8 @@ function useIslandForm(defaults) {
 }
 //#endregion
 //#region src/runtime/action.ts
-let _router = null;
-/** Called during app initialization to store the router instance */
-function setActionRouter(router) {
-	_router = router;
-}
-/** Programmatic one-shot page action call with Inertia page update */
-async function action(url, ...args) {
-	if (!_router) throw new Error("action(): called before router initialization.");
-	const options = args[0];
-	const data = options?.data;
-	const method = options?.method || "POST";
-	let resolvedUrl = url;
-	let actionQuery = "";
-	const qIdx = resolvedUrl.indexOf("?");
-	if (qIdx !== -1) {
-		actionQuery = resolvedUrl.slice(qIdx);
-		resolvedUrl = resolvedUrl.slice(0, qIdx);
-	}
-	if (options?.params) for (const [key, value] of Object.entries(options.params)) resolvedUrl = resolvedUrl.replace(`:${key}`, encodeURIComponent(value));
-	resolvedUrl = resolvedUrl + actionQuery;
-	return submitAction(_router, resolvedUrl, {
-		method,
-		data
-	});
-}
+const client = createActionClient();
+const action = client.action;
+const setActionRouter = client.setActionRouter;
 //#endregion
-export { useForm as a, useRouter as c, useNavigation as i, Link as l, setActionRouter as n, useShared as o, useIslandForm as r, useParams as s, action as t };
+export { useForm as a, useRouter as c, useNavigation as i, Link as l, setActionRouter as n, useShared as o, useIslandForm as r, useParams as s, action as t, Form as u };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@void/vue",
-  "version": "0.21.9",
+  "version": "0.23.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/voidzero-dev/void.git",
@@ -28,19 +28,19 @@
     "access": "public"
   },
   "dependencies": {
-    "@vitejs/plugin-vue": "^6.0.8"
+    "@vitejs/plugin-vue": "^6.0.9"
   },
   "devDependencies": {
-    "@types/node": "^26.5.1",
+    "@types/node": "^26.6.3",
     "pathslash": "^0.1.0",
-    "vite": "npm:@voidzero-dev/vite-plus-core@0.3.1",
-    "vite-plus": "0.3.1",
-    "void": "0.21.9",
-    "vue": "^3.5.42"
+    "vite": "npm:@voidzero-dev/vite-plus-core@1.0.0",
+    "vite-plus": "1.0.0",
+    "void": "0.23.0",
+    "vue": "^3.5.43"
   },
   "peerDependencies": {
     "vite": "^8.0.0",
-    "void": "0.21.9",
+    "void": "0.23.0",
     "vue": "^3.5.0"
   },
   "scripts": {