@void/vue 0.23.0 → 0.25.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,9 +1,17 @@
1
1
  # @void/vue
2
2
 
3
- Vue adapter for Void Pages mode.
3
+ Build server-rendered Void pages with Vue, server loaders, and typed forms.
4
4
 
5
5
  ## Setup
6
6
 
7
+ Install alongside `void`:
8
+
9
+ ```sh
10
+ npm install @void/vue
11
+ ```
12
+
13
+ Add the adapter to your Vite config. It includes the framework's Vite plugin:
14
+
7
15
  ```ts
8
16
  import { defineConfig } from 'vite';
9
17
  import { voidPlugin } from 'void';
@@ -14,118 +22,6 @@ export default defineConfig({
14
22
  });
15
23
  ```
16
24
 
17
- ## Plugin
18
-
19
- `voidVue(options?)` returns:
20
-
21
- - `@vitejs/plugin-vue`
22
- - the Vue pages plugin
23
- - the Vue islands plugin
24
-
25
- Options:
26
-
27
- - `vue?` — forwarded to `@vitejs/plugin-vue`
28
- - `viewTransitions?` — enable View Transitions for SPA navigation
29
-
30
- ## Runtime
31
-
32
- Main runtime APIs live at `@void/vue`:
33
-
34
- - `Link`
35
- - `useRouter()`
36
- - `useParams()`
37
- - `useNavigation()`
38
- - `useShared()`
39
- - `Form` and `useForm()`
40
- - `useIslandForm()`
41
- - `action()`
42
-
43
- Deferred helpers are exported from `@void/vue/deferred`.
44
-
45
- ### Link
46
-
47
- `Link` renders an `<a>` for GET navigation and a `<button>` for mutation methods:
48
-
49
- ```vue
50
- <Link href="/users" :data="{ page: 2, tag: ['active', 'new'] }">Filtered users</Link>
51
- <Link href="/users" replace>Users</Link>
52
- <Link href="/logout" reload-document>Sign out</Link>
53
- ```
54
-
55
- GET `data` is merged into the rendered `href` query string. Primitive values are serialized with `String(value)`, arrays become repeated keys, `null` and `undefined` are omitted, and nested objects throw.
56
-
57
- `prefetch` and `reloadDocument` are GET-only and throw for mutation links. `onNavigate` can cancel client-side navigation by calling `event.preventDefault()`.
58
-
59
- ### Forms
60
-
61
- `useForm()` tracks form state for Pages actions. Use `pending` for in-flight
62
- state, `errors` for field validation, and `error` for non-validation call-site
63
- failures. The submit helpers return promises so boundary-class failures can
64
- propagate through Vue async error handling or explicit `catch` handlers.
65
-
66
- GET navigation creates a fresh page instance, so forms receive the destination
67
- record's URL and defaults. Layouts remain mounted. Mutations and
68
- `router.refresh()` preserve page state by default; use `preserveState` to override
69
- this behavior when navigating within the same record.
70
-
71
- ```vue
72
- <script setup lang="ts">
73
- import { useForm } from '@void/vue';
74
-
75
- const form = useForm('/users', { name: '', email: '' });
76
- </script>
77
-
78
- <template>
79
- <form @submit.prevent="form.post()">
80
- <input v-model="form.data.name" name="name" />
81
- <p v-if="form.errors.name">{{ form.errors.name }}</p>
82
- <p v-if="form.error">{{ form.error.message }}</p>
83
- <button :disabled="form.pending">Save</button>
84
- </form>
85
- </template>
86
- ```
87
-
88
- Use `action()` for the awaitable imperative escape hatch. It returns
89
- `{ ok: true, pageData }` or `{ ok: false, error }` for call-site action errors,
90
- while boundary-class failures are thrown. `action()` uses `POST` by default and
91
- accepts `{ method: "PUT" | "PATCH" | "DELETE" }`.
92
-
93
- ## Pages
94
-
95
- Pages are `.vue` files in `pages/` with companion `.server.ts` files:
96
-
97
- ```vue
98
- <script setup lang="ts">
99
- defineProps<{ title: string }>();
100
- </script>
101
-
102
- <template>
103
- <h1>{{ title }}</h1>
104
- </template>
105
- ```
106
-
107
- ```ts
108
- import { defineHandler } from 'void';
109
-
110
- export const loader = defineHandler(() => ({ title: 'Home' }));
111
- ```
112
-
113
- Export `ssr = false` from a page's `.server.ts` file to skip server-rendered
114
- component HTML for that route while still running its loader on the first
115
- request.
116
-
117
- ## Form
118
-
119
- 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.
120
-
121
- `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.
122
-
123
- ## Tests
124
-
125
- Shared prefetch-cache tests live in `packages/void/test/unit/prefetch.test.ts`.
126
-
127
- - `test/integration/vue-pages-client.test.ts`
128
-
129
- Cross-package SSR/protocol coverage for Vue pages mode also lives in `packages/void/test/integration/*`.
25
+ Follow [Pages Routing](https://void.cloud/guide/pages-routing/overview) to add pages, then use [loaders](https://void.cloud/guide/pages-routing/loaders), [forms](https://void.cloud/guide/pages-routing/actions-and-forms), and [layouts](https://void.cloud/guide/pages-routing/layouts).
130
26
 
131
- The [shared client](../../test/pages-client-contract.ts) and [island](../../test/pages-island-contract.ts) contracts run against this adapter in both dev and preview. Shared form equality is tested directly in [Void](../void/test/unit/form-value-equality.test.ts); tests do not copy the hook implementation.
27
+ See the [adapter API reference](https://void.cloud/reference/api/pages) for plugin options and runtime helpers, and [TESTING.md](../../TESTING.md) for repository verification.
package/dist/plugin.mjs CHANGED
@@ -571,7 +571,7 @@ function replaceRecord(target, source) {
571
571
  Object.assign(target, source || {});
572
572
  }
573
573
 
574
- const { router, initialPageData, initialComponent, initialLayouts, start } =
574
+ const { router, initialPageData, initialComponent, initialLayouts, start, commitInitialRender } =
575
575
  await createVoidRouter({
576
576
  adapter: {
577
577
  createDeferred: () => createDeferred(),
@@ -644,6 +644,7 @@ app.mount(appEl);
644
644
  appEl.setAttribute("data-hydrated", "true");
645
645
  export { reactiveRouter as router };
646
646
  start();
647
+ commitInitialRender();
647
648
  `;
648
649
  }
649
650
  //#endregion
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@void/vue",
3
- "version": "0.23.0",
3
+ "version": "0.25.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/voidzero-dev/void.git",
@@ -31,16 +31,16 @@
31
31
  "@vitejs/plugin-vue": "^6.0.9"
32
32
  },
33
33
  "devDependencies": {
34
- "@types/node": "^26.6.3",
34
+ "@types/node": "^26.6.4",
35
35
  "pathslash": "^0.1.0",
36
36
  "vite": "npm:@voidzero-dev/vite-plus-core@1.0.0",
37
37
  "vite-plus": "1.0.0",
38
- "void": "0.23.0",
38
+ "void": "0.25.0",
39
39
  "vue": "^3.5.43"
40
40
  },
41
41
  "peerDependencies": {
42
42
  "vite": "^8.0.0",
43
- "void": "0.23.0",
43
+ "void": "0.25.0",
44
44
  "vue": "^3.5.0"
45
45
  },
46
46
  "scripts": {