ferrovue 0.7.1 → 0.8.0

package/README.md

@@ -215,10 +215,11 @@ ferrovue compiles `<script setup lang="ts">` components, and components with no
 | Shared types | Interfaces and type aliases imported from `.ts` files (generated once, into `types.rs`), from a store's file, or from another component's `.vue` file; objects of a shared type can be passed between components. A TypeScript `enum` whose members are literals is the type of its values: a string, or a number |
 | Constants | Constants imported from `.ts` files and `enum`s (imported, or declared in the component), evaluated when the component is compiled: strings, numbers, booleans, `null`, lists of them, objects of them read field by field (`LABELS.save`, `Tone.Loud`, `Rank[5]`), and lists of objects of them, which become a `const` in `types.rs` (`{ value, label }` items get a type named after the constant, `OptionsItem`, unless the constant is typed with an interface: `OPTIONS: Option[]`; a field that is `null` in some items is `T | null`). See [Constants](#constants) |
 | Props | `withDefaults`, destructured props with defaults (`const { size = "md" } = defineProps<…>()`), the props object (`const props = defineProps<…>()`, then `props.label` in the template or in script code), optional booleans (Vue casts an absent one to `false`), `defineModel` (named, required, with defaults), components with no props. A generic component (`<script setup generic="T extends Item">`) renders each type parameter as its constraint, which is all the template can rely on |
-| Setup | `ref`/`shallowRef`, `computed` (an expression or a single `return`), refs that start empty, typed by their type argument (`ref<Row[]>([])`, `ref<Row>()`, `ref<string \| undefined>(undefined)`), plain `const`/`let`, `.value` in script code, helpers with Rust twins, a plain `<script>` block beside setup. Lifecycle hooks, `watch` (not `immediate`), `defineEmits`, `defineSlots`, `defineOptions`, `defineExpose`, template refs (`ref(null)`, `useTemplateRef`) and functions are client-only. The template may name them only from event handlers, which the server drops |
+| Setup | `ref`/`shallowRef`, `computed` (an expression or a single `return`; one that may throw, through `.repeat()`, `.padStart()`, a date, `$t` or a helper, is evaluated where the render first reads it, once, as Vue does), refs that start empty, typed by their type argument (`ref<Row[]>([])`, `ref<Row>()`, `ref<string \| undefined>(undefined)`), plain `const`/`let`, `.value` in script code, helpers with Rust twins, a plain `<script>` block beside setup. Lifecycle hooks, `watch` (not `immediate`), `defineEmits`, `defineSlots`, `defineOptions`, `defineExpose`, template refs (`ref(null)`, `useTemplateRef`) and functions are client-only. The template may name them only from event handlers, which the server drops |
 | Provide and inject | `provide` and `inject` resolved through the component tree, slot content seeing the providers of the component that renders it, as Vue does: keys that are string literals or `InjectionKey` symbols exported from `.ts` files; values that are props, refs, `computed`s, constants or objects of them (an interface's fields, `reactive()` unwrapping refs); defaults, factory defaults (`inject(k, () => …, true)`), object defaults built as the key's interface (`inject(k, { size: "md" })`), and keys holding functions, which only event handlers may call. A page rendered from Rust passes the generated `Provides`, empty or holding what the client app gives `app.provide`. See the crate's [`provide_inject`](https://docs.rs/ferrovue/latest/ferrovue/guide/provide_inject/index.html) guide |
 | Text | `{{ }}` of strings, integers and booleans; `+`, `-`, `*`, `/`, `%`, with integers and fractions as JavaScript computes them; `<`, `>`, `<=`, `>=` (between numbers, or between strings by UTF-16 code unit), `===`, `!==`; unary `-`, `!`; `??`, `\|\|`, `&&`, `?:`; template literals; optional chaining `a?.b`; `.length`; `String()`, `.toString()`, `.toFixed()`, `Math.max`/`min`/`abs`/`round`/`floor`/`ceil`/`trunc`; `Number()`, `parseInt()` (no radix, 10 or 16), `parseFloat()`; `JSON.stringify()` of strings, numbers, booleans and lists of those; array literals |
 | Strings | `.trim()`, `.trimStart()`, `.trimEnd()`, `.toUpperCase()`, `.toLowerCase()`, `.includes()`, `.startsWith()`, `.endsWith()`, `.indexOf()`, `.lastIndexOf()`, `.slice()`, `.substring()`, `.at()`, `.charAt()`, `.split()`, `.replace()` and `.replaceAll()` with string patterns (`$&`, `` $` ``, `$'`, `$$` read as JavaScript reads them), `.padStart()`, `.padEnd()`, `.repeat()`; indices and lengths count UTF-16 code units, as JavaScript's do (see [Strings](#strings)) |
+| Dates | `new Date(s)` and `Date.parse(s)` of an ISO string (a date alone, or a date and time with a `Z` or an offset, as ECMAScript's date time string format specifies), `new Date(ms)`, `.toISOString()`, `.getTime()`, `.valueOf()` and the `.getUTC…()` methods, invalid dates included, as JavaScript computes them. Prices and formatted dates are written in Rust and passed as strings, or filled into a `$t` message. See the crate's [`dates_and_prices`](https://docs.rs/ferrovue/latest/ferrovue/guide/dates_and_prices/index.html) guide |
 | Conditions | `v-if` / `v-else-if` / `v-else`, `?:`, `&&` and `||`, with optional and nullable values narrowed as TypeScript narrows them: `v-if="user"`, `user !== undefined`, `user !== null`, `user != null`, and `!user`, `user === undefined` or `user === null` for the `v-else` |
 | Lists | `v-for` over arrays (of strings, numbers, objects or child props), array literals and number ranges (`n in 5`); with an index; with destructured items (`{ id, name } in rows`); nested; on `<template>`. `.includes()` (a number looked for in a list of numbers whether either is a `number` or a `Float`, as JavaScript compares them), `.join()`, and `.filter()`, `.map()`, `.some()`, `.every()`, `.find()`, `.findIndex()` with an arrow function of the item (a name, or destructured) and its index, whose body is an expression, narrowing inside as outside, or with `Boolean`; `.filter(Boolean)` of a list or an array literal whose items may be `null` or `undefined`, which keeps the ones present and truthy as a list of the values (`[name, title, city].filter(Boolean).join(" · ")`); `Boolean(x)`; `.slice()`; chained and nested; a computed list read by `v-for`, `.join()`, `.length`, `.includes()`, kept by `computed`, or handed to a child |
 | Dictionaries | `v-for="(value, key, index) in r"` over a `Record<string, T>`, and `([key, value], index) in Object.entries(r)`, in JavaScript's order: keys that are array indices first, in numeric order, then the others as the props give them; `Object.keys(r)`, `Object.values(r)`, `Object.entries(r).length`; handed to a child |
@@ -266,7 +267,13 @@ Refused at compile time, each with an error that names the construct:
 - the Options API (a `<script>` without `setup`), and a type parameter of a generic component with
   no constraint (`generic="T"`)
 - constants that are not literals (`Date.now()`, a function), an object constant read whole or by a
-  key chosen at run time (`LABELS[key]`), and `new` (`new Date(at)`, `new Intl.NumberFormat()`)
+  key chosen at run time (`LABELS[key]`), and `new` of anything but `Date` (`new Map()`)
+- the current time (`new Date()`, `Date.now()`), `new Date(year, month, …)`, a date string outside
+  ECMAScript's date time string format or with a time and no `Z` or offset, which browsers may read
+  differently (one from the props panics as it renders), the local getters (`.getFullYear()`,
+  `.getHours()`), `.toString()` and the other `Date` methods; and, permanently, locale formatting:
+  `Intl`, `.toLocaleString()`, `.toLocaleDateString()`, `.toLocaleTimeString()`, `.localeCompare()`
+  and vue-i18n's `$d` and `$n`, whose output differs between Node and each browser
 - `<RouterLink custom>`, slot props that are array literals, defaults in destructured slot props, and outlets of one slot that pass different props
 - custom directives not listed in `clientDirectives`
 - `watchEffect`, `watch` with `immediate`, `onServerPrefetch`, top-level `await`, and statements in setup that change state
@@ -773,23 +780,26 @@ pnpm bench:record   # rewrite benches/expected/*.html from Vue, after changing a
 ```
 
 The benchmarks are not part of `pnpm test`. CI runs both in a short mode only to check that they
-still build, run and agree on the HTML. It never compares their timings.
+still build, run and agree on the HTML. It never compares their timings. What CI does hold to a
+budget is the number of instructions each scenario runs, within 5% of a committed baseline, and
+the time ferrovue and `cargo build` take on a project of 500 components; [TESTING.md](https://github.com/Kinsmir/ferrovue/blob/main/TESTING.md#performance-budgets)
+describes both.
 
 ## Versions
 
 Byte-identical output depends on Vue's own SSR compiler, so ferrovue compiles with an exact
-`@vue/compiler-sfc` (currently 3.5.43), and its conformance fixtures are recorded from one version
+`@vue/compiler-sfc` (currently 3.5.44), and its conformance fixtures are recorded from one version
 of Vue and of each integration. Your project may use any later patch of the same minor:
 
 | Peer | Supported | Recorded from |
 |---|---|---|
-| `vue` | `~3.5.43` (3.5.43 and later 3.5 patches) | 3.5.43 |
-| `vue-router` (optional) | `~5.3.1` | 5.3.1 |
-| `pinia` (optional) | `~4.0.3` | 4.0.3 |
-| `vue-i18n` (optional) | `~11.4.13` | 11.4.13 |
-| `@unhead/vue` (optional) | `~3.4.2` | 3.4.2 |
+| `vue` | `~3.5.44` (3.5.44 and later 3.5 patches) | 3.5.44 |
+| `vue-router` (optional) | `~5.4.0` | 5.4.0 |
+| `pinia` (optional) | `~4.1.0` | 4.1.0 |
+| `vue-i18n` (optional) | `~11.4.15` | 11.4.15 |
+| `@unhead/vue` (optional) | `~3.4.3` | 3.4.3 |
 
-A new minor of any of them (Vue 3.6, vue-router 5.4, …) needs a ferrovue release that re-records
+A new minor of any of them (Vue 3.6, vue-router 5.5, …) needs a ferrovue release that re-records
 the fixtures from it. A weekly CI job re-records them from the newest patch each range allows and
 hydrates the committed HTML with it, so a patch that changes what Vue writes or hydrates is caught
 before it reaches you; a ferrovue patch follows when one does.
@@ -819,7 +829,7 @@ crates/ferrovue/             the Rust runtime crate, which generated code calls
   tests/sanitised/           a component whose `TrustedHtml` is `ferrovue::Sanitised`
   tests/vectors/             vectors recorded from JavaScript and Vue
   tests/properties.rs        property-based tests of the runtime
-  benches/                   criterion benchmarks of generated renderers (see Performance)
+  benches/                   criterion and instruction-count benchmarks of generated renderers
 crates/ferrovue-core/        escaping and JavaScript's numbers, which the other crates share
   tests/vectors/             vectors recorded from escapeHtml, String(n), Math and toFixed
 crates/ferrovue-router/      vue-router's matching and links (the `router` feature)
@@ -877,10 +887,12 @@ examples/fullstack/          axum + Vite: islands (some hydrating later), a page
                              Pinia state, routes from a folder of pages, the page head, streaming,
                              <ClientOnly>, a Rust twin, and a conformance suite
 examples/dioxus/             a Dioxus page, rendered with dioxus-ssr, with an island in it
+fuzz/                        cargo-fuzz targets for the runtime's escaping and JSON (see TESTING.md)
 scripts/ferrovue-in.ts       the `ferrovue` command run in a project of this repository (`pnpm conformance:check`, CI)
 scripts/inspect.ts           Vue's SSR code and render of a component beside the Rust ferrovue generates for it
 scripts/release.ts           the release version bump (see RELEASING.md)
 scripts/api-report.ts        the npm package's API report, written and checked (`pnpm api:report`, `pnpm api:check`)
+scripts/traceability.test.ts the README's "What a component may use" rows, traced to conformance components in TESTING.md
 ```
 
 ## Development

package/dist/calls.js

@@ -101,6 +101,8 @@ export function call(s, n) {
             const helper = s.helpers.get(method);
             if (helper)
                 return helperCall(s, helper, args, n);
+            if (s.clientOnly.has(method))
+                return fail(comp, "FV0613", `\`${method}\` is set up in a way the server cannot evaluate: ${s.clientOnly.get(method)}`, n);
         }
         if (callee.object.type === "Identifier" && callee.object.name === "Math") {
             const vals = args.map((a) => expr(s, a));
@@ -125,6 +127,9 @@ export function call(s, n) {
         }
         const literal = method === "filter" && args.length === 1 && isBoolean(s, args[0]) && callee.object.type === "ArrayExpression";
         const target = (literal ? presentLiteral(s, callee.object) : null) ?? expr(s, callee.object);
+        const typed = claim((p) => p.method?.(s, target, method, args, n));
+        if (typed)
+            return typed;
         if (target.ty.k === "str") {
             const lone = loneOf(target);
             switch (args.length === 0 ? method : "") {

package/dist/errors.d.ts

@@ -1069,6 +1069,26 @@ export declare const ERRORS: {
     readonly FV1711: {
         readonly title: "`innerHTML` or `textContent` on a head tag that has no content";
     };
+    readonly FV1801: {
+        readonly title: "The current time: `new Date()` or `Date.now()`";
+        readonly detail: "The server renders at one moment and the browser hydrates at another, so the text would differ. Read the time in Rust and pass it as a prop: an ISO string, or a number of milliseconds. See [`dates_and_prices`](crate::guide::dates_and_prices).";
+    };
+    readonly FV1802: {
+        readonly title: "`new Date()` or `Date.parse()` of anything but one present string or number";
+        readonly detail: "`new Date(year, month, …)` reads its parts in the time zone of the machine running it. A value that may be absent gives an invalid date for `undefined` and the epoch for `null`. See [`dates_and_prices`](crate::guide::dates_and_prices).";
+    };
+    readonly FV1803: {
+        readonly title: "Date string that browsers may read differently";
+        readonly detail: "ECMAScript specifies how a date alone (`2024-05-01`, `2024-05`, `2024`) and a date and time with a `Z` or an offset (`2024-05-01T09:30:00.000Z`, `2024-05-01T09:30+02:00`) are read. A date and time with neither is read in the time zone of the machine running it, and every other string by each engine's own rules, as are fields out of range (`2024-02-30`, `T24:00`) and fields beyond the range of dates that an offset brings back within it (`+275760-09-13T01:00+01:00`), which Safari reads as invalid. A literal is checked when the component is compiled; a string from the props is checked as it renders, and one outside the format panics. See [`dates_and_prices`](crate::guide::dates_and_prices).";
+    };
+    readonly FV1804: {
+        readonly title: "`Date` method or function ferrovue does not translate";
+        readonly detail: "A date is read with `.toISOString()`, `.getTime()`, `.valueOf()` and the `.getUTC…()` methods, which do not depend on the time zone. The local getters (`.getFullYear()`, `.getHours()`), `.getTimezoneOffset()` and `.toString()` read the time zone of the machine running them, which differs between the server and the reader's browser. See [`dates_and_prices`](crate::guide::dates_and_prices).";
+    };
+    readonly FV1805: {
+        readonly title: "Locale formatting with `Intl`, `.toLocaleString()`, `.localeCompare()`, `$d` or `$n`";
+        readonly detail: "`Intl` formats from locale data each JavaScript engine ships, and Node, Chromium, Firefox and Safari write some dates, times and numbers differently (spaces, separators, abbreviations), so no server can write what every reader's browser writes. This refusal is permanent. Format the value in Rust and pass it as a string prop, or write it with `.toFixed()` and `.toISOString()` into a message `$t` translates. See [`dates_and_prices`](crate::guide::dates_and_prices).";
+    };
 };
 /** A stable error code, as `FV0604`. */
 export type Code = keyof typeof ERRORS;

package/dist/errors.js

@@ -18,6 +18,7 @@ export const AREAS = {
     "15": { name: "Raw HTML, client-only content, teleports and Rust twins", guide: "errors_and_limits" },
     "16": { name: "Provide and inject", guide: "provide_inject" },
     "17": { name: "Page head", guide: "head" },
+    "18": { name: "Dates and locale formatting", guide: "dates_and_prices" },
 };
 /** Every code the compiler raises. A code is never reused: one the compiler stops raising is marked
  * `retired` and stays listed. `pnpm errors:generate` writes the guide's index from this list. */
@@ -448,6 +449,26 @@ export const ERRORS = {
         detail: "unhead's server renderer throws on a `class` or `style` of `null`. Write `?? undefined`, which leaves the attribute out.",
     },
     FV1711: { title: "`innerHTML` or `textContent` on a head tag that has no content" },
+    FV1801: {
+        title: "The current time: `new Date()` or `Date.now()`",
+        detail: "The server renders at one moment and the browser hydrates at another, so the text would differ. Read the time in Rust and pass it as a prop: an ISO string, or a number of milliseconds. See [`dates_and_prices`](crate::guide::dates_and_prices).",
+    },
+    FV1802: {
+        title: "`new Date()` or `Date.parse()` of anything but one present string or number",
+        detail: "`new Date(year, month, …)` reads its parts in the time zone of the machine running it. A value that may be absent gives an invalid date for `undefined` and the epoch for `null`. See [`dates_and_prices`](crate::guide::dates_and_prices).",
+    },
+    FV1803: {
+        title: "Date string that browsers may read differently",
+        detail: "ECMAScript specifies how a date alone (`2024-05-01`, `2024-05`, `2024`) and a date and time with a `Z` or an offset (`2024-05-01T09:30:00.000Z`, `2024-05-01T09:30+02:00`) are read. A date and time with neither is read in the time zone of the machine running it, and every other string by each engine's own rules, as are fields out of range (`2024-02-30`, `T24:00`) and fields beyond the range of dates that an offset brings back within it (`+275760-09-13T01:00+01:00`), which Safari reads as invalid. A literal is checked when the component is compiled; a string from the props is checked as it renders, and one outside the format panics. See [`dates_and_prices`](crate::guide::dates_and_prices).",
+    },
+    FV1804: {
+        title: "`Date` method or function ferrovue does not translate",
+        detail: "A date is read with `.toISOString()`, `.getTime()`, `.valueOf()` and the `.getUTC…()` methods, which do not depend on the time zone. The local getters (`.getFullYear()`, `.getHours()`), `.getTimezoneOffset()` and `.toString()` read the time zone of the machine running them, which differs between the server and the reader's browser. See [`dates_and_prices`](crate::guide::dates_and_prices).",
+    },
+    FV1805: {
+        title: "Locale formatting with `Intl`, `.toLocaleString()`, `.localeCompare()`, `$d` or `$n`",
+        detail: "`Intl` formats from locale data each JavaScript engine ships, and Node, Chromium, Firefox and Safari write some dates, times and numbers differently (spaces, separators, abbreviations), so no server can write what every reader's browser writes. This refusal is permanent. Format the value in Rust and pass it as a string prop, or write it with `.toFixed()` and `.toISOString()` into a message `$t` translates. See [`dates_and_prices`](crate::guide::dates_and_prices).",
+    },
 };
 /** Where a code is documented. */
 export function docsUrl(code) {

package/dist/expr.js

@@ -9,6 +9,7 @@ import { arithmetic, asF64, compare, intFromF64, isNumber, negatedOrder, numberV
 import { boolOf, checkNullTest, choice, known, narrowing, narrowTo, nullTest, pathOf, presence, truthy } from "./narrowing.js";
 import { call, isObjectCall } from "./calls.js";
 import { constOf, constVal } from "./constants.js";
+import { localeRefusal } from "./plugins/dates.js";
 export function describeTy(ty) {
     switch (ty.k) {
         case "str":
@@ -295,6 +296,8 @@ export function expr(s, n) {
             }
             if (n.name === s.propsIdent)
                 return { code: "props", ty: { k: "struct", name: "Props" } };
+            if (n.name === "Intl")
+                return localeRefusal(s, "`Intl`", n);
             return fail(comp, "FV0601", `\`${n.name}\` is not available when rendering on the server`, n);
         }
         case "MemberExpression": {
@@ -583,6 +586,9 @@ export function expr(s, n) {
         case "TSSatisfiesExpression":
             return stated(s, n);
         case "NewExpression": {
+            const own = claim((p) => p.construct?.(s, n));
+            if (own)
+                return own;
             const made = n.callee.type === "Identifier" ? n.callee.name : n.callee.type === "MemberExpression" && !n.callee.computed ? `${n.callee.object.name ?? "…"}.${n.callee.property.name}` : "…";
             return fail(comp, "FV0624", `\`new ${made}(…)\` builds an object the server has no twin for: compute the value in Rust and pass it as a prop`, n);
         }

package/dist/numbers.js

@@ -1,5 +1,5 @@
 import { BOOL, FLOAT, INT } from "./model.js";
-import { AS, binary, FLIPPED, operand, UNARY } from "./parens.js";
+import { AS, atom, binary, FLIPPED, operand, UNARY } from "./parens.js";
 import { expr } from "./expr.js";
 export function isNumber(ty) {
     return ty.k === "int" || ty.k === "float";
@@ -63,6 +63,13 @@ export function compare(a, op, b) {
         const konst = fold(a.num, op, b.num);
         return { code: String(konst), ty: BOOL, konst };
     }
+    if (asF64(a) === asF64(b)) {
+        if (op === "<" || op === ">")
+            return { code: "false", ty: BOOL, konst: false };
+        if (a.ty.k === "int")
+            return { code: "true", ty: BOOL, konst: true };
+        return { code: `!${atom(asF64(a))}.is_nan()`, ty: BOOL };
+    }
     return { code: binary(asF64(a), op, asF64(b)), ty: BOOL };
 }
 export function negatedOrder(s, n) {

package/dist/parens.js

@@ -178,7 +178,14 @@ export function strArg(code) {
     const branches = ifElse(code);
     if (branches)
         return `if ${branches.test} { ${strArg(branches.yes)} } else { ${strArg(branches.no)} }`;
+    if (/^\(\*\w+\)$/.test(code))
+        return bare(code);
     const m = /^&\*(\**)(.*)$/s.exec(code);
+    if (m && !m[1]) {
+        const lazy = /^\(\*(\w+)\)$/.exec(m[2])?.[1];
+        if (lazy !== undefined)
+            return `&${lazy}`;
+    }
     if (!m || (binding(m[2]) < ATOM && !enclosed(m[2])))
         return code;
     return m[1] ? m[2] : `&${m[2]}`;

package/dist/plugin.d.ts

@@ -75,6 +75,8 @@ export interface Plugin<Run = unknown, Local = unknown> {
     };
     global?(s: Scope, name: string, n: N): Val | null;
     call?(s: Scope, n: N): Val | null;
+    construct?(s: Scope, n: N): Val | null;
+    method?(s: Scope, target: Val, method: string, args: N[], n: N): Val | null;
     member?(s: Scope, base: Val, prop: string, n: N, computed: boolean): Val | null;
     equality?(s: Scope, n: N): Val | null;
     presence?(s: Scope, n: N): Presence | null | undefined;

package/dist/plugins/dates.d.ts

@@ -0,0 +1,19 @@
+import { type N, type Scope } from "../model.ts";
+import { type Plugin } from "../plugin.ts";
+declare module "../model.ts" {
+    interface PluginTys {
+        date: {
+            k: "date";
+        };
+    }
+}
+/** The time value `Date.parse(s)` gives a string every JavaScript engine reads alike: one in
+ * ECMAScript's date time string format, a date alone or a date and time with a `Z` or an offset, its
+ * fields within their ranges. `undefined` for any other string, which an engine may read by rules of
+ * its own, or in the time zone of the machine running it, and for a date and time whose fields lie
+ * beyond ±8.64 × 10¹⁵ ms read as UTC while its offset brings it within, which Safari reads as an
+ * invalid date and the other engines as a valid one. */
+export declare function portableTime(s: string): number | undefined;
+/** The refusal of anything that formats by locale, which `Intl` decides from data each engine ships. */
+export declare function localeRefusal(s: Scope, what: string, n: N): never;
+export declare const dates: Plugin;

package/dist/plugins/dates.js

@@ -0,0 +1,148 @@
+import { fail, FLOAT, STR } from "../model.js";
+import {} from "../plugin.js";
+import { bare, strArg } from "../parens.js";
+import { asF64, numberVal } from "../numbers.js";
+import { expr } from "../expr.js";
+const GUIDE = "see the `dates_and_prices` guide";
+const PORTABLE = /^([+-]\d{6}|\d{4})(?:-(\d{2})(?:-(\d{2}))?)?(?:T(\d{2}):(\d{2})(?::(\d{2})(?:\.\d{3})?)?(Z|[+-](\d{2}):(\d{2}))?)?$/;
+function daysInMonth(year, month) {
+    if (month === 2)
+        return year % 4 === 0 && (year % 100 !== 0 || year % 400 === 0) ? 29 : 28;
+    return [4, 6, 9, 11].includes(month) ? 30 : 31;
+}
+/** The time value `Date.parse(s)` gives a string every JavaScript engine reads alike: one in
+ * ECMAScript's date time string format, a date alone or a date and time with a `Z` or an offset, its
+ * fields within their ranges. `undefined` for any other string, which an engine may read by rules of
+ * its own, or in the time zone of the machine running it, and for a date and time whose fields lie
+ * beyond ±8.64 × 10¹⁵ ms read as UTC while its offset brings it within, which Safari reads as an
+ * invalid date and the other engines as a valid one. */
+export function portableTime(s) {
+    const m = PORTABLE.exec(s);
+    if (!m || m[1] === "-000000" || (m[4] !== undefined && m[7] === undefined))
+        return undefined;
+    const [year, month, day, hours, minutes, seconds, , zoneHours, zoneMinutes] = m.slice(1).map((x) => (x === undefined ? undefined : Number(x)));
+    const within = (x, low, high) => x === undefined || (x >= low && x <= high);
+    const fields = [within(month, 1, 12), within(day, 1, daysInMonth(year, month ?? 1)), within(hours, 0, 23), within(minutes, 0, 59), within(seconds, 0, 59), within(zoneHours, 0, 23), within(zoneMinutes, 0, 59)];
+    if (!fields.every(Boolean))
+        return undefined;
+    const t = Date.parse(s);
+    const zone = m[7];
+    if (zone !== undefined && zone !== "Z" && Number.isNaN(Date.parse(s.slice(0, -zone.length) + "Z")) && !Number.isNaN(t))
+        return undefined;
+    return t;
+}
+const LOCAL_GETTERS = new Map([
+    ["getFullYear", "getUTCFullYear"],
+    ["getYear", "getUTCFullYear"],
+    ["getMonth", "getUTCMonth"],
+    ["getDate", "getUTCDate"],
+    ["getDay", "getUTCDay"],
+    ["getHours", "getUTCHours"],
+    ["getMinutes", "getUTCMinutes"],
+    ["getSeconds", "getUTCSeconds"],
+    ["getMilliseconds", "getUTCMilliseconds"],
+]);
+const UTC_GETTERS = new Map([
+    ["getUTCFullYear", "full_year"],
+    ["getUTCMonth", "month"],
+    ["getUTCDate", "date"],
+    ["getUTCDay", "day"],
+    ["getUTCHours", "hours"],
+    ["getUTCMinutes", "minutes"],
+    ["getUTCSeconds", "seconds"],
+    ["getUTCMilliseconds", "milliseconds"],
+]);
+const LOCALE_METHODS = new Set(["toLocaleString", "toLocaleDateString", "toLocaleTimeString", "localeCompare"]);
+const DATE = { k: "date" };
+function global(s, n, name) {
+    return n?.type === "Identifier" && n.name === name && !s.locals.has(name) && !s.setup.has(name);
+}
+function rootOf(n) {
+    while (n?.type === "MemberExpression" || n?.type === "CallExpression" || n?.type === "NewExpression")
+        n = n.type === "MemberExpression" ? n.object : n.callee;
+    return n;
+}
+/** The refusal of anything that formats by locale, which `Intl` decides from data each engine ships. */
+export function localeRefusal(s, what, n) {
+    return fail(s.comp, "FV1805", `${what} formats by locale with \`Intl\`, whose output differs between Node, Chromium, Firefox and Safari: format the value in Rust and pass a string, or translate it with \`$t\` (${GUIDE})`, n);
+}
+function parsed(s, arg, what) {
+    if (arg.type === "StringLiteral") {
+        const t = portableTime(arg.value);
+        if (t === undefined) {
+            fail(s.comp, "FV1803", `${what} of ${JSON.stringify(arg.value)}, which is not a date alone nor a date and time with a \`Z\` or an offset in ECMAScript's date time string format, so each browser may read it differently (${GUIDE})`, arg);
+        }
+        return numberVal(t, false);
+    }
+    const v = expr(s, arg);
+    if (v.ty.k !== "str")
+        return fail(s.comp, "FV1802", `${what} takes a string that is present`, arg);
+    return { code: `fv::js_date_parse(${strArg(v.code)})`, ty: FLOAT };
+}
+function constructed(s, n) {
+    const args = n.arguments;
+    if (args.length === 0)
+        return fail(s.comp, "FV1801", `\`new Date()\` is the time it runs, which differs between the server's render and the browser's hydration: pass the time as a prop (${GUIDE})`, n);
+    if (args.length > 1) {
+        return fail(s.comp, "FV1802", `\`new Date(year, month, …)\` reads its parts in the time zone of the machine running it: pass an ISO string with a \`Z\` or an offset, or a number of milliseconds (${GUIDE})`, n);
+    }
+    if (args[0].type === "StringLiteral")
+        return { code: parsed(s, args[0], "`new Date()`").code, ty: DATE };
+    const v = expr(s, args[0]);
+    if (v.ty.k === "date")
+        return v;
+    if (v.ty.k === "str")
+        return { code: `fv::js_date_parse(${strArg(v.code)})`, ty: DATE };
+    if (v.ty.k === "int" || v.ty.k === "float")
+        return { code: `fv::js_time_clip(${bare(asF64(v))})`, ty: DATE };
+    return fail(s.comp, "FV1802", `\`new Date()\` takes one string or one number that is present (${GUIDE})`, args[0]);
+}
+export const dates = {
+    name: "dates",
+    construct(s, n) {
+        if (global(s, rootOf(n.callee), "Intl"))
+            return localeRefusal(s, "`Intl`", n);
+        return global(s, n.callee, "Date") ? constructed(s, n) : null;
+    },
+    call(s, n) {
+        const callee = n.callee;
+        if (callee.type !== "MemberExpression" || callee.computed)
+            return null;
+        const method = callee.property.name;
+        const object = callee.object;
+        if (object.type === "Identifier" && object.name === "_ctx" && (method === "$d" || method === "$n"))
+            return localeRefusal(s, `vue-i18n's \`${method}\``, n);
+        const own = object.type === "Identifier" && (object.name === "_ctx" || object.name === "$setup");
+        if (!own && LOCALE_METHODS.has(method))
+            return localeRefusal(s, `\`.${method}()\``, n);
+        if (!global(s, object, "Date"))
+            return null;
+        if (method === "now")
+            return fail(s.comp, "FV1801", `\`Date.now()\` is the time it runs, which differs between the server's render and the browser's hydration: pass the time as a prop (${GUIDE})`, n);
+        if (method === "parse" && n.arguments.length === 1)
+            return parsed(s, n.arguments[0], "`Date.parse()`");
+        return fail(s.comp, "FV1804", `\`Date.${method}()\` is not supported: build a date with \`new Date()\` of an ISO string or a number of milliseconds (${GUIDE})`, n);
+    },
+    method(s, target, method, args, n) {
+        if (target.ty.k !== "date")
+            return null;
+        const t = bare(target.code);
+        const plain = args.length === 0;
+        if (plain && method === "toISOString")
+            return { code: `&*fv::js_to_iso_string(${t})`, ty: STR };
+        if (plain && (method === "getTime" || method === "valueOf"))
+            return { code: target.code, ty: FLOAT };
+        const utc = UTC_GETTERS.get(method);
+        if (plain && utc !== undefined)
+            return { code: `fv::js_utc_${utc}(${t})`, ty: FLOAT };
+        if (LOCAL_GETTERS.has(method) || method === "getTimezoneOffset") {
+            const instead = LOCAL_GETTERS.get(method);
+            return fail(s.comp, "FV1804", `\`.${method}()\` reads the date in the time zone of the machine running it, which differs between the server and the reader's browser${instead ? `: use \`.${instead}()\`` : ""} (${GUIDE})`, n);
+        }
+        return fail(s.comp, "FV1804", `\`.${method}(${plain ? "" : "…"})\` on a \`Date\` is not supported: a date is read with \`.toISOString()\`, \`.getTime()\` and the \`.getUTC…()\` methods (${GUIDE})`, n);
+    },
+    values: {
+        describe: (ty) => (ty.k === "date" ? "a `Date`" : undefined),
+        unbindable: (ty) => ty.k === "date" ? { what: "a `Date`", fix: "bind `.toISOString()`, or format it in Rust and pass a string" } : undefined,
+    },
+};

package/dist/plugins/i18n.js

@@ -67,7 +67,7 @@ function messageSource(file, key, ast) {
         }
     };
     const items = (c) => c.items ?? (c.static !== undefined ? [{ type: 3, value: c.static }] : []);
-    return `Message { cases: &[${cases.map((c) => `&[${items(c).map(part).join(", ")}]`).join(", ")}] }`;
+    return `Message::new(&[${cases.map((c) => `&[${items(c).map(part).join(", ")}]`).join(", ")}])`;
 }
 function byteOrder(a, b) {
     return Buffer.compare(Buffer.from(a), Buffer.from(b));
@@ -76,13 +76,12 @@ function i18nSource(setup) {
     const locales = setup.locales
         .map((l) => {
         const keys = [...l.messages.keys()].toSorted(byteOrder);
-        const entries = keys.map((k) => `            (${rustStr(k)}, ${messageSource(l.file, k, l.messages.get(k))}),`).join("\n");
-        return `    Locale {
-        name: ${rustStr(l.name)},
-        messages: &[
+        if (keys.length === 0)
+            return `    Locale::new(${rustStr(l.name)}, &[]),`;
+        const entries = keys.map((k) => `        (${rustStr(k)}, ${messageSource(l.file, k, l.messages.get(k))}),`).join("\n");
+        return `    Locale::new(${rustStr(l.name)}, &[
 ${entries}
-        ],
-    },`;
+    ]),`;
     })
         .join("\n");
     return `${header(setup.dir.replace(/\/?$/, "/"), "the locale files")}
@@ -130,9 +129,9 @@ function translate(s, args, n) {
     const key = expr(s, args[0]);
     if (key.ty.k !== "str")
         fail(s.comp, "FV1409", "the key given to `t()` is a string", args[0]);
-    let named = "&[]";
-    let list = "&[]";
-    let plural = "None";
+    let named = "";
+    let list = "";
+    let plural = "";
     for (const a of args.slice(1)) {
         if (a.type === "ObjectExpression") {
             const pairs = a.properties.map((p) => {
@@ -140,10 +139,10 @@ function translate(s, args, n) {
                     fail(s.comp, "FV1410", "named values hold plain keys", p);
                 return `(${rustStr(String(p.key.name ?? p.key.value))}, ${i18nValue(s, p.value)})`;
             });
-            named = `&[${pairs.join(", ")}]`;
+            named = `.with_named(&[${pairs.join(", ")}])`;
         }
         else if (a.type === "ArrayExpression") {
-            list = `&[${a.elements.map((el) => i18nValue(s, el)).join(", ")}]`;
+            list = `.with_list(&[${a.elements.map((el) => i18nValue(s, el)).join(", ")}])`;
         }
         else {
             const v = expr(s, a);
@@ -151,10 +150,10 @@ function translate(s, args, n) {
                 fail(s.comp, "FV1411", "a default message given to `t()` is not supported: add the message to the locale files", a);
             if (v.ty.k !== "int")
                 fail(s.comp, "FV1412", "the plural number given to `t()` is an integer", a);
-            plural = `Some(${bare(v.code)})`;
+            plural = `.with_plural(${bare(v.code)})`;
         }
     }
-    return { code: `&*fv_i18n.t(${strArg(key.code)}, &fv::i18n::Args { named: ${named}, list: ${list}, plural: ${plural} })`, ty: STR };
+    return { code: `&*fv_i18n.t(${strArg(key.code)}, &fv::i18n::Args::new()${named}${list}${plural})`, ty: STR };
 }
 export const i18n = {
     name: "i18n",
@@ -193,6 +192,9 @@ export const i18n = {
                 s.setup.set(p.value.name, { code: "fv_i18n.locale()", ty: STR });
                 s.refs.add(p.value.name);
             }
+            else if (key === "d" || key === "n") {
+                s.clientOnly.set(p.value.name, `\`${key}\` from \`useI18n()\` formats by locale with \`Intl\`, whose output differs between Node and each browser (see the \`dates_and_prices\` guide)`);
+            }
             else
                 s.clientOnly.set(p.value.name, `\`${key}\` from \`useI18n()\` does not run on the server`);
         }

package/dist/plugins/index.js

@@ -10,4 +10,5 @@ import { twinsPlugin } from "./twins.js";
 import { provideInject } from "./provide.js";
 import { head } from "./head.js";
 import { cssModules } from "./css-modules.js";
-export const PLUGINS = [router, piniaStores, sharedTypes, i18n, teleport, scoped, clientOnly, twinsPlugin, provideInject, head, cssModules];
+import { dates } from "./dates.js";
+export const PLUGINS = [router, piniaStores, sharedTypes, i18n, teleport, scoped, clientOnly, twinsPlugin, provideInject, head, cssModules, dates];

package/dist/plugins/router.js

@@ -109,9 +109,10 @@ function routeDefs(routes, depth) {
     const pad = "    ".repeat(depth);
     return routes
         .map((r) => {
-        const name = r.name === undefined ? "None" : `Some(${rustStr(r.name)})`;
-        const children = r.children?.length ? `&[\n${routeDefs(r.children, depth + 1)}\n${pad}]` : "&[]";
-        return `${pad}ferrovue::RouteDef { path: ${rustStr(r.path)}, name: ${name}, view: ${r.view !== false}, children: ${children} },`;
+        const name = r.name === undefined ? "" : `.with_name(${rustStr(r.name)})`;
+        const view = r.view === false ? ".with_view(false)" : "";
+        const children = r.children?.length ? `.with_children(&[\n${routeDefs(r.children, depth + 1)}\n${pad}])` : "";
+        return `${pad}ferrovue::RouteDef::new(${rustStr(r.path)})${name}${view}${children},`;
     })
         .join("\n");
 }

package/dist/rust.d.ts

@@ -7,7 +7,7 @@ export declare function structSource(st: Struct, comp: Component, doc: string):
 /** The version of generated code this compiler writes, which `mod.rs` hands `ferrovue::__compat!`:
  * the highest version the `ferrovue` crate of the same release supports. RELEASING.md says when
  * it changes. */
-export declare const GENERATED_VERSION = 1;
+export declare const GENERATED_VERSION = 2;
 /** How every file ferrovue writes begins. */
 export declare const GENERATED = "// @generated by ferrovue";
 export declare function header(source: string, edit?: string): string;

package/dist/rust.js

@@ -7,7 +7,7 @@ import { childOf } from "./expr.js";
 import { Emitter } from "./emitter.js";
 import { occurrences } from "./parens.js";
 import { statements } from "./template.js";
-import { inlineCssVars } from "./styles.js";
+import { cssVarsReads, inlineCssVars } from "./styles.js";
 import { slotFieldBorrows, slotFieldTy, slotTypeName } from "./slots.js";
 import { extraParams, fieldInit, takesSlots } from "./children.js";
 import { paramsOf, renderParams, slotContextOf, slotFieldsOf } from "./plugin.js";
@@ -141,7 +141,7 @@ ${ctx.builders ? `\n${builderSource(st, comp, life)}\n` : ""}`;
 /** The version of generated code this compiler writes, which `mod.rs` hands `ferrovue::__compat!`:
  * the highest version the `ferrovue` crate of the same release supports. RELEASING.md says when
  * it changes. */
-export const GENERATED_VERSION = 1;
+export const GENERATED_VERSION = 2;
 /** How every file ferrovue writes begins. */
 export const GENERATED = "// @generated by ferrovue";
 export function header(source, edit = "the `.vue` file") {
@@ -222,7 +222,7 @@ export function componentSource(comp, ast, ssr, components) {
     if (takesAttrs(comp) && comp.inheritAttrs && comp.attrsDropped) {
         fail(comp, "FV0416", `a root \`<Transition>\` or \`<KeepAlive>\` around a \`v-if\` in ${comp.name}, which a parent passes attributes: Vue's server drops them, where its client puts them on the element; set \`inheritAttrs: false\` and bind \`$attrs\` on the element`, comp.attrsDropped);
     }
-    const { scope, lets } = scopeFor(comp, ast, components);
+    const { scope, lets, lazies } = scopeFor(comp, ast, components);
     const program = parseJs(ssr, { sourceType: "module" }).program;
     tagAst(program, "template");
     const fn = program.body.find((s) => s.type === "ExportNamedDeclaration" && s.declaration?.id?.name === "ssrRender")?.declaration;
@@ -230,7 +230,8 @@ export function componentSource(comp, ast, ssr, components) {
         fail(comp, "FV0006", "the compiled template has no `ssrRender`");
     const e = new Emitter();
     const preludes = ctx.plugins.flatMap((p) => (p.prelude ? [p.prelude(scope)] : []));
-    const opening = [...preludes.flatMap((p) => p.before), ...lets, ...preludes.flatMap((p) => p.after)];
+    const forced = [...cssVarsReads(fn.body.body)].flatMap((name) => (lazies.has(name) ? [`std::cell::LazyCell::force(&${lazies.get(name)});`] : []));
+    const opening = [...preludes.flatMap((p) => p.before), ...lets, ...forced, ...preludes.flatMap((p) => p.after)];
     for (const l of opening)
         e.stmt(l);
     statements(scope, e, inlineCssVars(comp, fn.body.body));

package/dist/script.d.ts

@@ -10,4 +10,5 @@ export declare function asyncChildren(comp: Component, ast: N[]): Map<string, st
 export declare function scopeFor(comp: Component, ast: N[], components: Map<string, Component>): {
     scope: Scope;
     lets: string[];
+    lazies: Map<string, string>;
 };

package/dist/script.js

@@ -6,7 +6,7 @@ import { constOfDecl, declareConsts } from "./constants.js";
 import { localTy } from "./rust.js";
 import { expr, fieldVal, typedBy } from "./expr.js";
 import { collected, heldList } from "./lists.js";
-import { bare, operand, UNARY } from "./parens.js";
+import { bare, occurrences, operand, UNARY } from "./parens.js";
 import { known } from "./narrowing.js";
 import { heldStr, isTemporary } from "./strings.js";
 import { intFromF64 } from "./numbers.js";
@@ -126,6 +126,36 @@ export function asyncChildren(comp, ast) {
     }
     return found;
 }
+const PANICS = /\bfv::js_(?:repeat|pad_start|pad_end|date_parse|to_iso_string)\(|\bfv_i18n\.t\(/;
+function mayPanic(scope, lazies, init) {
+    if (PANICS.test(init))
+        return true;
+    if ([...scope.helpers.values()].some((h) => init.includes(`${ctx.helpers[h].rust}(`)))
+        return true;
+    return [...lazies.values()].some((name) => occurrences(init, name) > 0);
+}
+function binding(v) {
+    const lone = v.lone ? { lone: true } : {};
+    if (v.slice)
+        return { init: bare(v.code), read: (at) => ({ code: at, ty: v.ty, slice: true, ...lone }) };
+    if (v.ty.k === "list" && v.iter !== undefined)
+        return { init: collected(v), read: (at) => heldList(at, v.ty.k === "list" ? v.ty.of : v.ty, v.lone) };
+    if (v.held !== undefined)
+        return { init: v.held, read: (at) => ({ code: `${at}.as_deref()`, ty: v.ty, ...lone }) };
+    if (v.ty.k === "int" && v.f64 !== undefined && (v.code.endsWith(" as i64") || Object.is(v.num, -0))) {
+        return {
+            init: bare(v.f64),
+            read: (at) => ({ ...intFromF64(at), ...lone, ...(v.num !== undefined ? { num: v.num } : {}), ...(v.konst !== undefined ? { konst: v.konst } : {}) }),
+        };
+    }
+    if (isTemporary(v))
+        return { init: heldStr(v), read: (at) => ({ code: `&*${at}`, ty: v.ty, ...lone }) };
+    const place = v.ty.k === "list" || v.ty.k === "record" || v.ty.k === "struct" || v.ty.k === "child";
+    return {
+        init: place ? `&${operand(v.code, UNARY)}` : bare(v.code),
+        read: (at) => ({ code: at, ty: v.ty, ...lone, ...(v.konst !== undefined ? { konst: v.konst } : {}) }),
+    };
+}
 export function scopeFor(comp, ast, components) {
     const scope = {
         comp,
@@ -168,6 +198,7 @@ export function scopeFor(comp, ast, components) {
     };
     const locals = declareConsts(comp, ast);
     const lets = [];
+    const lazies = new Map();
     const asyncs = asyncChildren(comp, ast);
     let useAttrsName = null;
     let useSlotsName = null;
@@ -284,6 +315,7 @@ export function scopeFor(comp, ast, components) {
             const isRef = init0.type === "CallExpression" && init0.callee.type === "Identifier" && ["ref", "shallowRef", "computed"].includes(init0.callee.name);
             if (isRef)
                 scope.refs.add(local);
+            const isComputed = isRef && init0.callee.name === "computed";
             const typed = isRef ? init0.typeParameters?.params?.[0] : (d.id.typeAnnotation?.typeAnnotation ?? statedTy(init0));
             const untyped = setupSource(init0);
             const source = untyped && typed ? typedBy(untyped, typed) : untyped;
@@ -299,7 +331,7 @@ export function scopeFor(comp, ast, components) {
             catch (e) {
                 if (!(e instanceof GenError))
                     throw e;
-                scope.clientOnly.set(local, e.message.replace(/^[^:]*: /, ""));
+                scope.clientOnly.set(local, e.what);
                 continue;
             }
             if (nothing(v.ty) || (v.ty.k === "str" && known(v) !== undefined)) {
@@ -307,36 +339,13 @@ export function scopeFor(comp, ast, components) {
                 continue;
             }
             const name = `s_${snake(local).replace(/^r#/, "")}`;
-            const lone = v.lone ? { lone: true } : {};
-            if (v.slice) {
-                lets.push(`let ${name} = ${bare(v.code)};`);
-                scope.setup.set(local, { code: name, ty: v.ty, slice: true, ...lone });
-                continue;
-            }
-            if (v.ty.k === "list" && v.iter !== undefined) {
-                lets.push(`let ${name} = ${collected(v)};`);
-                scope.setup.set(local, heldList(name, v.ty.of, v.lone));
-                continue;
-            }
-            if (v.held !== undefined) {
-                lets.push(`let ${name} = ${v.held};`);
-                scope.setup.set(local, { code: `${name}.as_deref()`, ty: v.ty, ...lone });
-                continue;
-            }
-            if (v.ty.k === "int" && v.f64 !== undefined && (v.code.endsWith(" as i64") || Object.is(v.num, -0))) {
-                lets.push(`let ${name} = ${bare(v.f64)};`);
-                scope.setup.set(local, { ...intFromF64(name), ...lone, ...(v.num !== undefined ? { num: v.num } : {}), ...(v.konst !== undefined ? { konst: v.konst } : {}) });
-                continue;
-            }
-            if (isTemporary(v)) {
-                lets.push(`let ${name} = ${heldStr(v)};`);
-                scope.setup.set(local, { code: `&*${name}`, ty: v.ty, ...lone });
-                continue;
-            }
-            const place = v.ty.k === "list" || v.ty.k === "record" || v.ty.k === "struct" || v.ty.k === "child";
-            lets.push(`let ${name} = ${place ? `&${operand(v.code, UNARY)}` : bare(v.code)};`);
-            scope.setup.set(local, { code: name, ty: v.ty, ...lone, ...(v.konst !== undefined ? { konst: v.konst } : {}) });
+            const { init, read } = binding(v);
+            const lazy = isComputed && mayPanic(scope, lazies, init);
+            lets.push(lazy ? `let ${name} = std::cell::LazyCell::new(|| ${init});` : `let ${name} = ${init};`);
+            scope.setup.set(local, read(lazy ? `(*${name})` : name));
+            if (lazy)
+                lazies.set(local, name);
         }
     }
-    return { scope, lets };
+    return { scope, lets, lazies };
 }

package/dist/strings.js

@@ -30,7 +30,7 @@ export function isTemporary(v) {
     const trimmed = /^fv::js_trim(?:_start|_end)?\(([^]*)\)$/.exec(v.code);
     if (trimmed?.[1] !== undefined)
         return isTemporary({ code: trimmed[1].replace(/^&(?!\*)/, "&*"), ty: v.ty });
-    return /^&\*(?!\**[\w.]+$)/.test(v.code) || /\.unwrap_or\(&\*(?!\**[\w.]+\)$)/.test(v.code);
+    return /^&\*(?!\**[\w.]+$|\(\*\w+\)$)/.test(v.code) || /\.unwrap_or\(&\*(?!\**[\w.]+\)$)/.test(v.code);
 }
 export function asCow(v) {
     if (!isTemporary(v))

package/dist/styles.d.ts

@@ -4,6 +4,9 @@ import { Emitter } from "./emitter.ts";
  * `<style>`, in place of each use of it in the compiled template's statements, with each value
  * marked to be written as `ssrRenderStyle` writes a variable. */
 export declare function inlineCssVars(comp: Component, body: N[]): N[];
+/** The setup bindings the `_cssVars` object reads, which Vue's server evaluates as its render
+ * starts. */
+export declare function cssVarsReads(body: N[]): Set<string>;
 export declare function mergedStyle(s: Scope, e: Emitter, n: N): void;
 export declare function styleAttr(s: Scope, n: N): string;
 export interface StyleItem {

package/dist/styles.js

@@ -72,6 +72,28 @@ export function inlineCssVars(comp, body) {
     swap(rest);
     return rest;
 }
+/** The setup bindings the `_cssVars` object reads, which Vue's server evaluates as its render
+ * starts. */
+export function cssVarsReads(body) {
+    const names = new Set();
+    const declared = body.find((st) => st.type === "VariableDeclaration" && st.declarations[0]?.id?.name === "_cssVars");
+    const walk = (n) => {
+        if (!n || typeof n !== "object")
+            return;
+        if (Array.isArray(n))
+            return n.forEach(walk);
+        if (n.type === "MemberExpression" && n.object.type === "Identifier" && (n.object.name === "$setup" || n.object.name === "_ctx")) {
+            const name = n.computed ? n.property.value : n.property.name;
+            if (typeof name === "string")
+                names.add(name);
+        }
+        for (const [k, v] of Object.entries(n))
+            if (k !== "loc" && v && typeof v === "object")
+                walk(v);
+    };
+    walk(declared?.declarations[0].init);
+    return names;
+}
 function cssVarOf(s, n) {
     const v = expr(s, n.value);
     const of = v.ty.k === "opt" ? v.ty.of : v.ty;

package/dist/vite.js

@@ -1,5 +1,5 @@
 import { readdirSync, readFileSync } from "node:fs";
-import { join, resolve, sep } from "node:path";
+import { join, posix, resolve, sep } from "node:path";
 import { CONFIG_FILE, loadConfig, write } from "./compiler.js";
 import { formatRefusal, formatWarning, isRefusal } from "./diagnostics.js";
 import { allPages, fileRoutes, pagesFolder } from "./file-routes.js";
@@ -130,6 +130,28 @@ ${routesTree(root, routes, "  ", false)}
 ];
 `;
 }
+function islandsFile({ consumer, build }) {
+    const { manifest } = build;
+    if (!manifest || consumer !== "client")
+        return null;
+    const written = typeof manifest === "string" ? manifest : ".vite/manifest.json";
+    return posix.join(posix.dirname(written), "ferrovue-islands.json");
+}
+function islandsJson(root, islands, bundle) {
+    const names = new Map(Object.entries(islands).map(([name, file]) => [resolve(root, file), name]));
+    const files = {};
+    for (const chunk of bundle) {
+        if (chunk.type !== "chunk")
+            continue;
+        for (const id of chunk.moduleIds ?? []) {
+            const name = names.get(resolve(id));
+            if (name !== undefined)
+                files[name] = chunk.fileName;
+        }
+    }
+    const sorted = Object.fromEntries(Object.entries(files).toSorted(([a], [b]) => (a < b ? -1 : a > b ? 1 : 0)));
+    return `${JSON.stringify(sorted, null, 2)}\n`;
+}
 /** The Rust renderers regenerated by a Vite build and its dev server, and the `ferrovue/islands`
  * and `ferrovue/routes` modules. */
 export default function ferrovue(options = {}) {
@@ -199,6 +221,12 @@ export default function ferrovue(options = {}) {
                 throw e;
             }
         },
+        generateBundle(_, bundle) {
+            const manifest = islandsFile(this.environment.config);
+            if (manifest === null || islands === null)
+                return;
+            this.emitFile({ type: "asset", fileName: manifest, source: islandsJson(root, islands, Object.values(bundle)) });
+        },
         configureServer(server) {
             if (!inputs) {
                 let config = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ferrovue",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "Vue templates compiled to Rust render functions: server-side rendering with no JavaScript at run time",
   "license": "MIT OR Apache-2.0",
   "repository": {
@@ -77,11 +77,11 @@
   },
   "dependencies": {
     "@babel/parser": "^7.29.9",
-    "@intlify/message-compiler": "11.4.13",
-    "@vue/compiler-sfc": "3.5.43",
-    "@vue/shared": "3.5.43",
+    "@intlify/message-compiler": "11.4.15",
+    "@vue/compiler-sfc": "3.5.44",
+    "@vue/shared": "3.5.44",
     "generic-names": "^4.0.0",
-    "postcss": "^8.5.28",
+    "postcss": "^8.5.30",
     "postcss-modules-extract-imports": "^3.1.0",
     "postcss-modules-local-by-default": "^4.2.0",
     "postcss-modules-scope": "^3.2.1",
@@ -89,30 +89,30 @@
     "source-map-js": "^1.2.2"
   },
   "devDependencies": {
-    "@unhead/vue": "^3.4.2",
-    "@vue/language-core": "3.3.12",
-    "@vue/language-service": "3.3.12",
-    "@vue/server-renderer": "3.5.43",
-    "pinia": "^4.0.3",
-    "playwright": "1.63.0",
+    "@unhead/vue": "^3.4.3",
+    "@vue/language-core": "3.3.13",
+    "@vue/language-service": "3.3.13",
+    "@vue/server-renderer": "3.5.44",
+    "pinia": "^4.1.0",
+    "playwright": "1.64.1",
     "typescript": "^7.0.2",
     "typescript-js": "npm:typescript@6.0.3",
-    "vite": "^8.3.0",
-    "vitest": "^5.0.1",
-    "vscode-uri": "3.1.0",
-    "vue": "3.5.43",
-    "vue-i18n": "11.4.13",
-    "vue-router": "^5.3.1"
+    "vite": "^8.3.4",
+    "vitest": "^5.0.5",
+    "vscode-uri": "3.2.0",
+    "vue": "3.5.44",
+    "vue-i18n": "11.4.15",
+    "vue-router": "^5.4.0"
   },
   "peerDependencies": {
-    "@unhead/vue": "~3.4.2",
+    "@unhead/vue": "~3.4.3",
     "@vue/language-core": "^3.3.0",
-    "pinia": "~4.0.3",
+    "pinia": "~4.1.0",
     "vite": ">=6",
     "vitest": ">=5",
-    "vue": "~3.5.43",
-    "vue-i18n": "~11.4.13",
-    "vue-router": "~5.3.1"
+    "vue": "~3.5.44",
+    "vue-i18n": "~11.4.15",
+    "vue-router": "~5.4.0"
   },
   "peerDependenciesMeta": {
     "@unhead/vue": {