ferrovue 0.13.0 → 0.14.1

package/README.md

@@ -57,7 +57,7 @@ the configuration at your project root yourself:
 
 ```json
 {
-  "$schema": "https://cdn.jsdelivr.net/npm/ferrovue@0.13.0/schema.json",
+  "$schema": "https://cdn.jsdelivr.net/npm/ferrovue@0.14.1/schema.json",
   "components": "client/components",
   "out": "src/generated"
 }
@@ -86,6 +86,7 @@ read `$schema`. Offline, the copy in the installed package works as well:
 | `scopeId` | no | How a `<style scoped>` id is hashed, as `@vitejs/plugin-vue` hashes it: `"filepath-source"` (the default, the plugin's in a production build) or `"filepath"`. See [`scoped_styles`](https://docs.rs/ferrovue/latest/ferrovue/guide/scoped_styles/index.html) |
 | `viteRoot` | no | Vite's root, relative to this file's directory, from which a component's path is hashed (default `.`) |
 | `isProduction` | no | Whether `@vitejs/plugin-vue` compiles for production, as Vite's `isProduction`: `true` (the default) for `vite build`, `false` for the dev server. It names the variables `v-bind()` in `<style>` sets. See [`scoped_styles`](https://docs.rs/ferrovue/latest/ferrovue/guide/scoped_styles/index.html) |
+| `comments` | no | Whether templates' HTML comments render, as plugin-vue's `template.compilerOptions.comments`: by default kept when `isProduction` is `false` and left out otherwise. See [`generated_code`](https://docs.rs/ferrovue/latest/ferrovue/guide/generated_code/index.html#html-comments) |
 | `cssModules` | no | `{ generateScopedName, hashPrefix?, context? }`, as Vite's `css.modules` names CSS module classes: needed for `<style module>`. `context` is the directory Vite runs in (default `viteRoot`). See [`scoped_styles`](https://docs.rs/ferrovue/latest/ferrovue/guide/scoped_styles/index.html) |
 | `builders` | no | `false` leaves out each props struct's and shared type's `new()` and setters, for an app that builds its props as struct literals (default `true`) |
 
@@ -173,7 +174,7 @@ The crate's features:
 
 - `router` and `i18n`, both on by default: vue-router and vue-i18n. An application with neither
   routes nor translations can leave them out, and build neither `ferrovue-router` nor
-  `ferrovue-i18n`: `ferrovue = { version = "0.13", default-features = false }`.
+  `ferrovue-i18n`: `ferrovue = { version = "0.14", default-features = false }`.
 - `axum` and `actix-web`: `Html` is an `IntoResponse` or a `Responder`, so a handler responds with
   the component as `text/html; charset=utf-8`. `into_html(props)` and `into_island(props)` take the
   props by value, so a handler that builds them returns the page:
@@ -225,7 +226,7 @@ ferrovue compiles `<script setup lang="ts">` components, and components with no
 |---|---|
 | Prop types | `string`, `number` (integers, `i64`, written and computed as JavaScript does, exact within ±2⁵³), `Float` from `ferrovue/types` (fractions, `f64`), `boolean`, unions of two or more string literals (`"sm" \| "md"`, an alias, or written in place), each a Rust enum generated for it (`Size::Md`, `"md".parse::<Size>()`, written and serialised as its literal; see the crate's [`props`](https://docs.rs/ferrovue/latest/ferrovue/guide/props/index.html#unions-of-string-literals) guide), or an enum of the application's own that `unions` names for the alias; a list of such a union, a list of its enum (`Size[]` is `Vec<Size>`); `T \| undefined`, `T \| null` (an `Option` written as `null`), arrays (`T[]`, `Array<T>`, `readonly T[]`), interfaces and object type aliases (recursive ones too), object types written in place, mapped types and `Record`s over a union of names, indexed types (`Card["size"]`), tuples (`[label: string, n: number]`, a tuple struct written as an array), dictionaries (`Record<string, T>`, `{ [key: string]: T }`, `ferrovue::props::Record` in Rust, which keeps JavaScript's order of keys), another component's exported `Props`, `TrustedHtml`, `InlineHtml`, `Date` (a prop, optional or nullable too, and inside lists, dictionaries and interfaces: `ferrovue::date::JsDate`, or `chrono::DateTime<Utc>` with the `chrono` feature) |
 | Shared types | Interfaces and type aliases imported from `.ts` files (generated once, into `types.rs`; imported by a relative path or through an alias the project declares, in its tsconfig.json's `compilerOptions.paths` or, with the Vite plugin, Vite's `resolve.alias`: `@/lib/format`), 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` of string members is a Rust enum, as a union of string literals is, its variants named after its members; one of numbers is a number |
-| Constants | Constants imported from `.ts` files, object constants declared in `<script setup>`, and `enum`s (imported, or declared in the component, with members set to such constants or to earlier members), evaluated when the component is compiled: strings, numbers, booleans, `null`, arithmetic and joined strings of them as JavaScript evaluates them (`60 * MINUTE`, `` `${BASE}/feed` ``, `"#" + 1.5`, and `**` where it gives an exact integer within ±2⁵³), 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`); lookup tables: an object constant (`as const`, `Record<Size, T>` or untyped, keys computed from enum members too) read by a key whose type is a union of string or integer literals or an `enum` (a prop, a `computed`, a `v-for` item's field, a `?:` of literals, or built from one by `.toUpperCase()`, `.toLowerCase()` or a template literal), or by a constant number (`O[HALF]` reads `O["0.5"]`), compiled to a `match` over the members (over the variants of a union's enum, with no catch-all arm; a table of a union's members, `Record<Tone, Tone>`, reaches a union prop as a `match` from variant to variant), read on by field (`THEME[tone].fg`) in text, attributes, `:class` and `:style`, with `undefined` for a member the object lacks (`ICONS[kind] ?? "none"`, `ICONS[kind]?.label`, `v-if="ICONS[kind]"`, `kind && ICONS[kind]`); a free-text key tested with `Object.hasOwn(ROLES, key)`, against the object's own keys, which narrows the key for `ROLES[key]` in what follows; `Object.keys()` of an object constant; a constant `new Map([[key, value], …])` of string or integer keys, read with `.get(key)` (`undefined` for a key it lacks) and `.has(key)`. See the crate's [`props`](https://docs.rs/ferrovue/latest/ferrovue/guide/props/index.html#constants) guide |
+| Constants | Constants imported from `.ts` files (exported on their declaration, by name in `export { A, B as C }`, as `export default A`, or passed on with `export { A } from` and `export * from`), object constants declared in `<script setup>`, and `enum`s (imported, or declared in the component, with members set to such constants or to earlier members), evaluated when the component is compiled: strings, numbers, booleans, `null`, arithmetic and joined strings of them as JavaScript evaluates them (`60 * MINUTE`, `` `${BASE}/feed` ``, `"#" + 1.5`, and `**` where it gives an exact integer within ±2⁵³), 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`); lookup tables: an object constant (`as const`, `Record<Size, T>` or untyped, keys computed from enum members too) read by a key whose type is a union of string or integer literals or an `enum` (a prop, a `computed`, a `v-for` item's field, a `?:` of literals, or built from one by `.toUpperCase()`, `.toLowerCase()` or a template literal), or by a constant number (`O[HALF]` reads `O["0.5"]`), compiled to a `match` over the members (over the variants of a union's enum, with no catch-all arm; a table of a union's members, `Record<Tone, Tone>`, reaches a union prop as a `match` from variant to variant), read on by field (`THEME[tone].fg`) in text, attributes, `:class` and `:style`, with `undefined` for a member the object lacks (`ICONS[kind] ?? "none"`, `ICONS[kind]?.label`, `v-if="ICONS[kind]"`, `kind && ICONS[kind]`); a free-text key tested with `Object.hasOwn(ROLES, key)`, against the object's own keys, which narrows the key for `ROLES[key]` in what follows; `Object.keys()` of an object constant; a constant `new Map([[key, value], …])` of string or integer keys, read with `.get(key)` (`undefined` for a key it lacks) and `.has(key)`. See the crate's [`props`](https://docs.rs/ferrovue/latest/ferrovue/guide/props/index.html#constants) guide |
 | Props | Props declared in place, by an interface of the component, or by one imported from a `.ts` file by a relative path (`defineProps<CardProps>()`), extended or joined with `&`; `withDefaults`, destructured props with defaults and new names (`const { size = "md", label: text } = 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 body of statements: see Statements; 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)`), refs of a union of string literals, held as its enum (`ref<Choice>(props.tone ?? "")`, a member, a value of the union, a lookup table's value, or a `?:` or `??` of them), plain `const`/`let`, `.value` in script code, helpers with Rust twins, functions (see Functions), a plain `<script>` block beside setup. Lifecycle hooks, `watch` (not `immediate`), `defineEmits`, `defineSlots`, `defineOptions`, `defineExpose` and template refs (`ref(null)`, `useTemplateRef`) are client-only, as is a function only an event handler calls. The template may name them only from event handlers, which the server drops |
 | Statements | in a `computed`'s body and in a list method's callback (`.map()`, `.filter()`, `.find()`, `.some()`, `.reduce()`, a `.toSorted()` comparator and the others): `const` and `let` of any value the template may compute, destructured too (`const { name, posts: count } = author`); `if` / `else if` / `else` and early `return`, narrowing what follows as TypeScript narrows it (`if (!user) return ""; return user.name`, `if (!a \|\| !a.title) return "-"`); `switch` over a string or a number, with stacked `case`s, `default` and `break`; assignments to the body's `let`s (`=`, `+=`, `-=`, `*=`, `++`, `--` and the others), with the type TypeScript gives them; `for (const x of list)` over a list, `list.entries()`, `Object.keys()` or `Object.entries()`, `for (const ch of text)` over a string by its characters (a character beyond U+FFFF is one), and counting loops `for (let i = 0; i < n; i++)` to an integer bound, with `break`, `continue`, nested loops and `return` inside them, carrying strings, numbers and booleans from one item to the next (`let total = 0; for (const r of rows) total += r.n;`, thousands separators, the largest of a list). Each value is evaluated once, where JavaScript evaluates it, and only on the path that reaches it. `while`, `do…while` and `for…in` loops, assignments to props, refs, `const`s, parameters and fields, `try`, `throw`, `var` and a path that ends without `return` are refused. See the crate's [`script_logic`](https://docs.rs/ferrovue/latest/ferrovue/guide/script_logic/index.html) guide |
@@ -239,18 +240,19 @@ ferrovue compiles `<script setup lang="ts">` components, and components with no
 | 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`, `typeof user !== "undefined"`, and `!user`, `user === undefined` or `user === null` for the `v-else`; a test narrows every operand after it in a chain (`n != null && n > 1 && n < 9`, `n == null \|\| n < 0 \|\| n > 9`, `n != null && n > 1 ? n * 2 : 0`), and `a && b` gives `undefined` where `a`, whose present values are all truthy, is absent (`kind && ICONS[kind]`); a string of a union of string literals narrowed the same way, by `===` and `!==` with a literal, by its truth and by `||`, so that a `ref<Tone | "">` reaches a child's `Tone` prop as `tone \|\| undefined`, `tone === '' ? undefined : tone`, under `v-if="tone !== ''"` or through a `computed` annotated `Tone \| undefined` |
 | 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()`, `.findLast()`, `.findLastIndex()` with an arrow function of the item (a name, or destructured) and its index, whose body is an expression or a body of statements (see Statements), 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()`; an item by its index, `list[i]` with an integer `i` and `list.at(i)` (from the end when negative), `undefined` outside the list and narrowed as other optional values are (`v-if="rows[0]"`); `.indexOf()` and `.lastIndexOf()` of a string, number or boolean, compared with `===` (`NaN` found nowhere, `-0` found as `0`); `.concat()` of lists of one item type (numbers whether `number` or `Float`); `.reduce()` and `.reduceRight()` with an initial value, into a string, a number or a boolean; `.toReversed()`, and `.toSorted()` by `String(x)` as JavaScript sorts without a comparator (`[10, 9, 1]` to `[1, 10, 9]`) or by a comparator `(a, b) => a - b`, `a.k - b.k` of integers or `?:` over `<` and `>` of integers or strings, stable as JavaScript's; `[...list].sort(…)` and `[...list].reverse()`; spread in array literals (`[...a, x, ...b]`) of one item type; `.flat()` of lists of lists, to a literal depth or `Infinity`, and `.flatMap()` with an arrow function that gives a list (flattened one level) or a value (kept as `.map()` keeps it); 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)` (of a record of lists too, which `.flat()` joins), `Object.hasOwn(r, key)`, and `Object.entries(r)` read by the list methods, whose arrow functions destructure each pair (`([key, value]) => …`, `([, value]) => …`, `([key, { id }]) => …`) or read its parts (`pair[0]`, `pair[1]`), and walked by `v-for="[key, value] in Object.entries(r).filter(…)"`, kept by `computed` and sorted by a comparator of either part; handed to a child |
+| HTML comments | left out, as Vue's production build leaves them out, or kept with `comments` or `"isProduction": false`, as on the dev server: written as Vue writes them, at the root, between roots, inside elements and in slot content |
 | Attributes | static and bound attributes, boolean attributes, `:hidden`, `data-*` and `aria-*`, `v-bind` objects |
 | `class` | strings, arrays, objects (`{ active: on }`, computed keys), `cond && "x"`, `cond ? "x" : null`, merged with a static `class` |
 | `style` | objects (camelCase or kebab-case keys, `--custom` properties), arrays of objects, strings, merged with a static `style`, and `v-show`; later values override earlier ones as in Vue. A global `<style>` block is allowed |
 | Scoped styles | `<style scoped>`: the id on every element, on child components' roots (a root that is itself a component, fragments, recursion and `inheritAttrs: false` as Vue renders them) and, from a component with `:slotted()` rules, on the slot content it is given, forwarded slots included; inside `<Transition>`, `<KeepAlive>`, `<Teleport>` and `v-if`; on `<RouterLink>` and what it holds, as vue-router renders them |
 | `v-bind()` in `<style>` | variables bound to props, setup values, `computed`s and constants, quoted expressions included (`v-bind('size + "px"')`), in a scoped or global `<style>`: written into the root's `style` after its own and what a parent passes, on each root of a fragment, and handed to a root that is a component, as Vue's server writes them; `undefined` and `null` as `initial`, an empty string as a space; named as plugin-vue names them for production or development (`isProduction`) |
 | CSS modules | `<style module>` and `<style module="name">`, read as `$style.x`, `name.x`, `$style['x-y']` and through `useCssModule()`, each class a constant in the generated code, when `cssModules` mirrors Vite's `css.modules.generateScopedName`: computed as postcss-modules computes it in Vite (`[local]`, `[name]`, `[hash:base64:5]`, `[path]` and the rest), composed classes, `@value`s and keyframes included |
-| Components | imported child components, `v-bind` of a child's own `Props`, listeners in any form (`@x`, `v-on="obj"`, `@[name]`), which the server skips, `v-model` on a child's `defineModel`, recursion; props named in `kebab-case` or `camelCase`; props named like listeners (`on1`, `onSale`), left out when falsy where Vue's `mergeProps` joins a child's props, as Vue leaves them out; `defineAsyncComponent(() => import("./X.vue"))` (or `{ loader: … }`), rendered as the component it loads, which Vue's server renderer waits for |
+| Components | imported child components, `v-bind` of a child's own `Props`, listeners in any form (`@x`, `v-on="obj"`, `@[name]`), which the server skips, `v-model` on a child's `defineModel`, recursion; props named in `kebab-case` or `camelCase`; a `boolean` prop written bare (`<Button disabled />`), as `""` or as its kebab-case name, which Vue casts to `true`; props named like listeners (`on1`, `onSale`), left out when falsy where Vue's `mergeProps` joins a child's props, as Vue leaves them out; `defineAsyncComponent(() => import("./X.vue"))` (or `{ loader: … }`), rendered as the component it loads, which Vue's server renderer waits for |
 | `<component :is>` | over a closed set of choices, compiled to a `match`: an imported component (`:is="Card"`), an HTML element's name (`is="h2"`), a `computed` or `?:` choosing among them, a prop or a `defineModel` typed as a union of string literals (`as: "h1" \| "h2"`, a `match` over its enum's variants), and an object of imported components (or element names) declared in setup or imported from a `.ts` file, read by such a prop (`ICONS[name]`); props, fallthrough attributes, slots and scope ids reach each choice as they reach a static child; also inside `<KeepAlive>` and `<Transition>`. See the crate's [`generated_code`](https://docs.rs/ferrovue/latest/ferrovue/guide/generated_code/index.html#component-is) guide |
 | Escape hatches | `<ClientOnly>` from `ferrovue`, whose default slot the server never renders, so anything may go in it; components listed in `twins`, rendered by Rust functions of yours. See the crate's [`errors_and_limits`](https://docs.rs/ferrovue/latest/ferrovue/guide/errors_and_limits/index.html#client-only-content) guide |
 | Fallthrough attributes | what a parent passes a child beyond its props (static and bound attributes, `class`, `style`, `data-*`, `aria-*`, booleans, `undefined`): onto its single root, merged with the root's own class and style and replacing its other attributes where they stand, as Vue's `mergeProps` merges them; none for two roots; on through a root that is a component, or a `<RouterLink>`; with `inheritAttrs: false`, onto the elements or components that bind `v-bind="$attrs"` or a `useAttrs()` binding, before or after their own; beside scope ids. Listeners are dropped, as Vue's server drops them. See the crate's [`generated_code`](https://docs.rs/ferrovue/latest/ferrovue/guide/generated_code/index.html#fallthrough-attributes) guide |
 | Slots | default and named slots, fallbacks, `$slots.name` tests and the same through `useSlots()`, scoped slots (`<slot :item="x">` and `#item="{ item }"` or `v-slot="props"`), whose props a parent can hand to its own children |
-| Forms | `v-model` on text inputs, checkboxes, radios, `<select>` and `<textarea>` (renders the initial state); a `<textarea>`, or an `<input>` with `v-model` of a literal `type`, at the component's root where no parent passes it `value` or `type` (FV0424 otherwise) |
+| Forms | `v-model` on text inputs, checkboxes, radios, `<select>` and `<textarea>` (renders the initial state), of a string or a string that may be absent, with an `<option>` with no `value` compared with `null` as Vue's server compares it; a `<textarea>`, or an `<input>` with `v-model` of a literal `type`, at the component's root where no parent passes it `value` or `type` (FV0424 otherwise) |
 | Built-ins | `<Transition>`, `<TransitionGroup>`, `<KeepAlive>`, `<Suspense>` (synchronous content), `<Teleport>` (to any target, nested, disabled: see below), `v-text`, `v-once`, `v-pre`, `v-memo`, custom directives listed in `clientDirectives`, on an element with no content when its attributes are bound by name and it is not the component's root (FV0425) |
 | Vue Router | `<RouterLink>` (resolved by name or imported) with a string `to` or `{ name, params, query, hash }` / `{ path, query, hash }`, `active-class`, `exact-active-class`, `aria-current-value`, `replace`; vue-router's own encoding and active-link matching, nested routes included (a parent link is active on its children's pages, exact only on its own); a history base; optional parameters (`:id?`); routes built from a folder of pages, which the Vite plugin also gives the client as `ferrovue/routes`. `useRoute()` and `$route`: `path`, `fullPath`, `hash`, `name`, `params`, and `query` (a value written once, without `=`, or repeated, exactly as vue-router parses it; `typeof route.query.q === "string"` narrows one to a single string). `<RouterView>`, at the top and in nested route components: each takes the page it shows as a slot |
 | Pinia | option stores with a typed `state`, and setup stores (`defineStore(id, () => { … })`) whose returned refs are typed by `ref<T>()` or their initial literal; read through `useX()` or `storeToRefs`, in the template or in `computed`; getters that are an expression of the state, and a setup store's computeds, which may read each other |
@@ -307,7 +309,9 @@ The crate's guide, `ferrovue::guide` on docs.rs, covers each topic in depth:
   from a Node server that renders with Vue, and the
   [support policy](https://docs.rs/ferrovue/latest/ferrovue/guide/support/index.html): supported
   versions, fixes, deprecations and where to report a problem
-- Upgrading a project [from 0.11 to 0.12](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_12/index.html),
+- Upgrading a project [from 0.13 to 0.14](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_14/index.html),
+  [from 0.12 to 0.13](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_13/index.html),
+  [from 0.11 to 0.12](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_12/index.html),
   [from 0.10 to 0.11](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_11/index.html),
   [from 0.9 to 0.10](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_10/index.html),
   [from 0.8 to 0.9](https://docs.rs/ferrovue/latest/ferrovue/guide/upgrading_to_0_9/index.html)

package/dist/attrs.d.ts

@@ -1,6 +1,7 @@
-import { type N, type Scope, type Val } from "./model.ts";
+import { type N, type Piece, type Scope, type Val } from "./model.ts";
 import { type ErrorCode } from "./errors.ts";
 import { Emitter } from "./emitter.ts";
+export declare function displayPieces(e: Emitter, pieces: Piece[]): void;
 export declare function display(e: Emitter, v: Val): boolean;
 export declare function interpolate(s: Scope, e: Emitter, v: Val, n: N): void;
 export declare function attrValue(e: Emitter, v: Val): void;

package/dist/attrs.js

@@ -1,20 +1,70 @@
 import { escapeHtml, hyphenate, isBooleanAttr, isSSRSafeAttrName, isSVGTag, propsToAttrMap } from "@vue/shared";
-import { fail, nothing, rustStr } from "./model.js";
+import { fail, neverEmpty, nothing, rustStr } from "./model.js";
 import { GenError } from "./errors.js";
 import { asWritten } from "./numbers.js";
 import { CONFIG_FILE } from "./config.js";
 import { ctx } from "./context.js";
 import { describeTy, expr, shown } from "./expr.js";
 import { known, truthy } from "./narrowing.js";
-import { asCow, isTemporary, unquote } from "./strings.js";
-import { atom, bare, condition, receiver, scrutinee, strArg } from "./parens.js";
+import { asCow, isTemporary, piecesOf, unquote } from "./strings.js";
+import { atom, bare, condition, ifElse, logical, not, receiver, scrutinee, strArg } from "./parens.js";
 import { Emitter } from "./emitter.js";
 import { isDollarAttrs } from "./fallthrough.js";
 import { claim } from "./plugin.js";
 import { classAttr, classPresent, literalClass, maybeEqual, renderClass } from "./classes.js";
 import { mergedStyle, renderStyle, styleAttr } from "./styles.js";
 const NUMBER_BYTES = 6;
+function emptyTest(v) {
+    if (neverEmpty(v.ty))
+        return "false";
+    const branches = v.branches;
+    if (branches !== undefined && branches.of === v.code) {
+        const [yes, no] = [emptyTest(branches.yes), emptyTest(branches.no)];
+        const binds = branches.test.startsWith("let ");
+        if (yes === no && !binds)
+            return yes;
+        if (!binds && yes === "false")
+            return logical(not(branches.test), "&&", no);
+        if (!binds && no === "false")
+            return logical(branches.test, "&&", yes);
+        return `if ${branches.test} { ${yes} } else { ${no} }`;
+    }
+    const pieces = piecesOf(v);
+    if (pieces === undefined)
+        return `${receiver(v.code)}.is_empty()`;
+    const strs = pieces.filter((p) => typeof p !== "string" && !("shown" in p) && p.ty.k === "str");
+    if (strs.length < pieces.length || strs.some((p) => neverEmpty(p.ty)))
+        return "false";
+    return strs.map((p) => `${receiver(p.code)}.is_empty()`).join(" && ");
+}
+export function displayPieces(e, pieces) {
+    for (const p of pieces) {
+        if (typeof p === "string")
+            e.lit(escapeHtml(p));
+        else if ("shown" in p)
+            e.stmt(`{ use std::fmt::Write as _; let _ = write!(out, "{}", ${p.shown}); }`);
+        else
+            display(e, p);
+    }
+}
 export function display(e, v) {
+    const pieces = piecesOf(v);
+    if (pieces !== undefined) {
+        displayPieces(e, pieces);
+        return true;
+    }
+    const branches = v.branches;
+    if (branches !== undefined && branches.of === v.code) {
+        e.open(`if ${branches.test}`);
+        display(e, branches.yes);
+        e.close(" else {");
+        const at = e.lines.length;
+        display(e, branches.no);
+        e.close();
+        if (e.lines.length === at + 1)
+            e.lines.splice(at - 1, 2, e.lines[at - 1].replace(/\} else \{$/, "}"));
+        return true;
+    }
     if (v.ty.k === "str" && known(v) !== undefined)
         e.lit(escapeHtml(unquote(v.code)));
     else if ((v.ty.k === "int" || v.ty.k === "float") && v.num !== undefined)
@@ -65,10 +115,31 @@ function renderable(s, key, v, n) {
     const fix = own?.fix ?? (ty.k === "list" ? 'join it into one string, as `.join(",")`' : "bind a string, a number or a boolean");
     fail(s.comp, "FV0403", `\`${key}\` is bound to ${what}: Vue's server renderer leaves the attribute out, and hydration then sets it, changing the page; ${fix}`, n);
 }
+/** For an optional string that is a literal where a test holds and absent where it fails, the
+ * test and the literal. */
+function someLiteral(v) {
+    const branches = v.ty.k === "opt" ? ifElse(v.code) : null;
+    if (branches === null || v.ty.k !== "opt")
+        return null;
+    const literal = (code) => /^Some\(("(?:[^"\\]|\\.)*")\)$/.exec(code)?.[1];
+    const [yes, no] = [literal(branches.yes), literal(branches.no)];
+    if (yes !== undefined && branches.no === "None")
+        return { test: branches.test, value: { code: yes, ty: v.ty.of } };
+    if (no !== undefined && branches.yes === "None" && !branches.test.startsWith("let "))
+        return { test: not(branches.test), value: { code: no, ty: v.ty.of } };
+    return null;
+}
 export function renderAttr(s, e, key, v, n) {
     renderable(s, key, v, n);
     if (nothing(v.ty))
         return;
+    const some = someLiteral(v);
+    if (some !== null) {
+        e.open(`if ${condition(some.test)}`);
+        renderAttr(s, e, key, some.value, n);
+        e.close();
+        return;
+    }
     if (v.ty.k === "opt") {
         e.open(`if let Some(v) = ${scrutinee(v.code)}`);
         renderAttr(s, e, key, { code: "v", ty: v.ty.of }, n);
@@ -104,6 +175,13 @@ export function renderDynamicAttr(s, e, key, v, n, tag = null) {
         e.close();
         return;
     }
+    const some = someLiteral(v);
+    if (some !== null) {
+        e.open(`if ${condition(some.test)}`);
+        renderDynamicAttr(s, e, key, some.value, n, tag);
+        e.close();
+        return;
+    }
     if (v.ty.k === "opt") {
         e.open(`if let Some(v) = ${scrutinee(v.code)}`);
         renderDynamicAttr(s, e, key, { code: "v", ty: v.ty.of }, n, tag);
@@ -125,8 +203,9 @@ export function renderDynamicAttr(s, e, key, v, n, tag = null) {
         e.lit(` ${name}`);
         return;
     }
-    if (v.ty.k === "str" && known(v) === undefined) {
-        e.open(`if ${receiver(v.code)}.is_empty()`);
+    const empty = v.ty.k === "str" && known(v) === undefined ? emptyTest(v) : "false";
+    if (empty !== "false") {
+        e.open(`if ${empty}`);
         e.lit(` ${name}`);
         e.close(" else {");
         e.lit(` ${name}="`);

package/dist/calls.js

@@ -1,16 +1,17 @@
-import { BOOL, fail } from "./model.js";
+import { absence, BOOL, fail, rustStr } from "./model.js";
 import { ctx } from "./context.js";
 import { claim } from "./plugin.js";
-import { atom, bare } from "./parens.js";
+import { atom, bare, binary } from "./parens.js";
 import { isBoolean, listCall, listMethod, presentLiteral } from "./lists.js";
 import { meet, noArgStringMethod, regexTest, stringMethod, stringsEqual } from "./strings.js";
 import { numberMethod } from "./numbers.js";
 import { boolOf, truthy } from "./narrowing.js";
-import { coerce, expr, refuseClientOnly, refuseUnavailable } from "./expr.js";
+import { coerce, describeTy, expr, refuseClientOnly, refuseUnavailable } from "./expr.js";
 import { callFunction } from "./functions.js";
 import { constOf, mapCall } from "./constants.js";
 import { refuseInPlace } from "./objects.js";
 import { globalCall, mathCall, staticCall } from "./globals.js";
+import { refValue } from "./members.js";
 export function call(s, n) {
     const callee = n.callee;
     if (callee.type === "Identifier")
@@ -57,24 +58,35 @@ function renderHelperCall(s, name, args, n) {
 }
 function looseEqual(s, args, n) {
     const a = expr(s, args[0]);
+    const absent = a.ty.k === "opt" && a.ty.of.k === "str" ? absence(a.ty) : null;
+    const written = args[1]?.type === "NullLiteral" ? "null" : args[1]?.type === "StringLiteral" ? args[1].value : null;
+    if (args[1]?.type === "NullLiteral" && a.ty.k === "str")
+        return boolOf(binary(a.code, "==", '"null"'));
+    if (absent !== null && written !== null) {
+        return boolOf(written === absent ? `${atom(a.code)}.is_none_or(|v| v == ${rustStr(written)})` : binary(a.code, "==", `Some(${rustStr(written)})`));
+    }
+    if (args[1]?.type === "NullLiteral") {
+        return fail(s.comp, "FV0413", `an \`<option>\` with no \`value\` under a \`<select>\` whose \`v-model\` is ${describeTy(a.ty)}, which Vue's server compares with \`null\`: give the option a \`value\`, and the model a string type`, n);
+    }
     const b = expr(s, args[1]);
     if (a.ty.k === "str" && b.ty.k === "str") {
         meet(s.comp, a, b, "`v-model`", n, "equal");
         return boolOf(stringsEqual(a, b));
     }
-    return fail(s.comp, "FV0413", "`v-model` comparison between these types", n);
+    return fail(s.comp, "FV0413", `\`v-model\` of ${describeTy(a.ty)} compared with a value that is ${describeTy(b.ty)}: give the model a string type and each option or control a string \`value\`, or bind \`:checked\` or \`:selected\``, n);
 }
 function includeBooleanAttr(s, args) {
     const a = expr(s, args[0]);
     if (a.konst !== undefined)
         return a;
-    if (a.ty.k === "str")
+    if (a.ty.k === "str" || a.ty.k === "html")
         return { code: "true", ty: BOOL, konst: true };
-    if (a.ty.k === "opt" && a.ty.of.k === "str")
+    if (a.ty.k === "opt" && (a.ty.of.k === "str" || a.ty.of.k === "html"))
         return { code: `${atom(a.code)}.is_some()`, ty: BOOL };
     return boolOf(truthy(a));
 }
 function memberCall(s, n) {
+    refValue(s, n.callee);
     const object = n.callee.object;
     const method = n.callee.property.name;
     const args = n.arguments;

package/dist/children.js

@@ -1,4 +1,4 @@
-import { isSSRSafeAttrName, propsToAttrMap } from "@vue/shared";
+import { hyphenate, isSSRSafeAttrName, propsToAttrMap } from "@vue/shared";
 import { absence, camelize, declares, enumItems, enumOf, fail, literalsOf, nothing, REFUSALS, refusalAt, rustStr, sameTy, snake, takesAttrs, variantPath } from "./model.js";
 import { ctx } from "./context.js";
 import { known } from "./narrowing.js";
@@ -101,7 +101,7 @@ export function renderChild(s, e, n, twin) {
                         fail(s.comp, "FV0517", `\`${key}\`, a prop of ${child.name}, a Rust twin, is named like a listener, which Vue's \`mergeProps\` leaves out when it is falsy: rename the prop`, p);
                     heard.add(field.js);
                 }
-                given.set(field.js, p.value);
+                given.set(field.js, castToTrue(field, p.value) ? { type: "BooleanLiteral", value: true, loc: p.value.loc, start: p.value.start, end: p.value.end, __fv: p.value.__fv } : p.value);
                 continue;
             }
             if (array(key))
@@ -133,6 +133,16 @@ export function renderChild(s, e, n, twin) {
     });
     callChild(s, e, child, `&super::${child.module}::Props { ${inits.join(", ")} }`, slots, childAttrsArg(s, child, parts, merges, fallthrough, ids, n), later);
 }
+/** Whether Vue's boolean casting turns `value`, given to the prop `f`, into `true`: the prop's
+ * runtime type is `Boolean`, and the value is `""` (the attribute written bare) or the prop's name in
+ * kebab-case. */
+function castToTrue(f, value) {
+    const ty = f.ty.k === "opt" ? f.ty.of : f.ty;
+    if (ty.k !== "bool")
+        return false;
+    const text = value.type === "StringLiteral" ? value.value : value.type === "TemplateLiteral" && value.expressions.length === 0 ? value.quasis[0].value.cooked : null;
+    return text === "" || text === hyphenate(camelize(f.js));
+}
 /** What `v`, a reference to a value of the prop `f` of type `ty`, passes when it is truthy: null when
  * every value of the type is. */
 function truthTest(s, child, f, ty, n) {
@@ -319,10 +329,18 @@ export function callWith(s, e, child, m, head, slotsTy, trailing, slots, vnode =
                 statements({ ...inner, fill: false }, e, body);
                 e.stmt("true");
             }
-            else {
-                e.stmt("let mut filled = false;");
-                statements({ ...inner, fill: true }, e, body);
+            else
+                fillable(inner);
+        };
+        const fillable = (inner) => {
+            e.stmt("let mut filled = false;");
+            const declared = e.lines.length - 1;
+            statements({ ...inner, fill: true }, e, body);
+            if (e.reads("filled", declared + 1))
                 e.stmt("filled");
+            else {
+                e.lines.splice(declared, 1);
+                e.stmt("false");
             }
         };
         const unread = (opened, binding) => {
@@ -350,6 +368,7 @@ export function callWith(s, e, child, m, head, slotsTy, trailing, slots, vnode =
             e.open(`${field}: Some(&|out: &mut String, ${sp}: &${m}::${shape.name}${life}${sidParam}${contextParams}| -> bool`);
             const opened = e.lines.length - 1;
             content({ ...s, locals, sid, vnode: asVnodes, opaque });
+            unread(opened, "out");
             unread(opened, sp);
             unread(opened, sid);
             for (const p of context)
@@ -364,6 +383,7 @@ export function callWith(s, e, child, m, head, slotsTy, trailing, slots, vnode =
             e.open(`${field}: Some(&|out: &mut String${sidParam}${contextParams}| -> bool`);
             const opened = e.lines.length - 1;
             content(inner);
+            unread(opened, "out");
             unread(opened, sid);
             for (const p of context)
                 unread(opened, p.name);
@@ -373,6 +393,7 @@ export function callWith(s, e, child, m, head, slotsTy, trailing, slots, vnode =
             e.open(`${field}: Some(fv::render::Slot::slotted(&|out: &mut String${sidParam}| -> bool`);
             const opened = e.lines.length - 1;
             content(inner);
+            unread(opened, "out");
             unread(opened, sid);
             e.close(")),");
         }
@@ -383,9 +404,9 @@ export function callWith(s, e, child, m, head, slotsTy, trailing, slots, vnode =
         }
         else {
             e.open(`${field}: Some(fv::render::Slot::markup(&|out: &mut String| -> bool`);
-            e.stmt("let mut filled = false;");
-            statements({ ...inner, fill: true }, e, body);
-            e.stmt("filled");
+            const opened = e.lines.length - 1;
+            fillable(inner);
+            unread(opened, "out");
             e.close(")),");
         }
     }

package/dist/classes.d.ts

@@ -1,9 +1,10 @@
-import { type N, type Scope } from "./model.ts";
+import { type N, type Scope, type Val } from "./model.ts";
 import { Emitter } from "./emitter.ts";
 export type ClassItem = {
     lit: string;
 } | {
     code: string;
+    join?: Val;
 };
 export declare function classItems(s: Scope, n: N): ClassItem[];
 export declare function renderClass(s: Scope, e: Emitter, n: N, after?: boolean): void;

package/dist/classes.js

@@ -3,10 +3,10 @@ import { directiveOwner, fail, nothing, rustStr, STR } from "./model.js";
 import { expr } from "./expr.js";
 import { choice, cond, known, narrowing, narrowTo, presence, truthy } from "./narrowing.js";
 import { pickPresent } from "./constants.js";
-import { meet } from "./strings.js";
+import { meet, piecesOf, unquote } from "./strings.js";
 import { atom, bare, condition, logical, not, occurrences, strArg } from "./parens.js";
 import { Emitter } from "./emitter.js";
-import { stringAttr } from "./attrs.js";
+import { displayPieces, stringAttr } from "./attrs.js";
 import { fresh, jsHint } from "./names.js";
 export function classItems(s, n) {
     switch (n.type) {
@@ -73,8 +73,13 @@ export function classItems(s, n) {
             break;
     }
     const v = expr(s, n);
+    const literal = v.ty.k === "str" && known(v) !== undefined ? unquote(v.code) : null;
+    if (literal === "")
+        return [];
+    if (literal !== null && literal === literal.trim())
+        return [{ lit: literal }];
     if (v.ty.k === "str")
-        return [{ code: v.code }];
+        return [piecesOf(v) === undefined ? { code: v.code } : { code: v.code, join: v }];
     if (v.ty.k === "opt" && v.ty.of.k === "str")
         return [{ code: `${atom(v.code)}.unwrap_or("")` }];
     if (nothing(v.ty))
@@ -113,10 +118,49 @@ export function renderClass(s, e, n, after = false) {
         e.lit((wrote ? " " : "") + escapeHtml(it.lit));
         wrote = true;
     }
-    if (i < items.length) {
-        const rest = items.slice(i).map((it) => ("lit" in it ? rustStr(it.lit) : it.code));
-        e.stmt(`fv::attrs::class_into(out, ${wrote}, &[${rest.join(", ")}]);`);
+    let group = [];
+    let at = null;
+    for (; i < items.length; i++) {
+        const it = items[i];
+        const parts = "join" in it && it.join !== undefined ? trimmedParts(it.join) : null;
+        if (parts === null) {
+            if (!group.length && !wrote && items.slice(i + 1).some((later) => "join" in later && later.join !== undefined)) {
+                at = fresh("at", "class");
+                e.stmt(`let ${at} = out.len();`);
+            }
+            group.push("lit" in it ? rustStr(it.lit) : it.code);
+            continue;
+        }
+        if (group.length)
+            e.stmt(`fv::attrs::class_into(out, ${wrote}, &[${group.join(", ")}]);`);
+        if (wrote)
+            e.lit(" ");
+        else if (group.length && at !== null)
+            e.stmt(`if out.len() != ${at} { out.push(' '); }`);
+        displayPieces(e, parts);
+        [group, at, wrote] = [[], null, true];
+    }
+    if (group.length)
+        e.stmt(`fv::attrs::class_into(out, ${wrote}, &[${group.join(", ")}]);`);
+}
+/** The pieces of a joined class name with the spaces `normalizeClass` trims taken off its ends,
+ * when only its first or last piece may hold them and the join writes a name: null otherwise. */
+function trimmedParts(v) {
+    const pieces = [...piecesOf(v)];
+    const solid = (p, start) => p !== undefined && (typeof p === "string" ? p !== "" && p === (start ? p.trimStart() : p.trimEnd()) : "shown" in p || p.ty.k !== "str");
+    for (const start of [true, false]) {
+        const edge = start ? 0 : pieces.length - 1;
+        const next = start ? 1 : pieces.length - 2;
+        const p = pieces[edge];
+        if (typeof p === "string")
+            pieces[edge] = start ? p.trimStart() : p.trimEnd();
+        if (solid(pieces[edge], start))
+            continue;
+        if (typeof p === "string" || "shown" in p || pieces.length < 2 || !solid(pieces[next], start))
+            return null;
+        pieces[edge] = { code: `fv::strings::js_trim_${start ? "start" : "end"}(${strArg(p.code)})`, ty: STR };
     }
+    return pieces;
 }
 const UNWRITTEN = new Set(["on", "if", "else-if", "else", "for", "slot", "once", "memo", "cloak", "pre"]);
 /** The class list of an element in content Vue renders from virtual nodes, in the order Vue's

package/dist/client.d.ts

@@ -177,8 +177,8 @@ export interface RenderPageOptions extends Pick<MountOptions, "pinia" | "router"
  * document: load the components it names (and no others), render the app `createPageApp` builds
  * with `hydrate: false` into a copy of the container with no children, wait for the router, put the
  * copy in the container's place, mount, and then unmount `previous`. The next app is mounted
- * before the previous one is unmounted, so a router both use stays started. `router` must be at the
- * next page's location: `linkRouter` with the `location` the navigation goes to. Rejects, leaving
- * the page shown as it is, when the container is missing or a component is not given or does not
- * load. */
+ * before the previous one is unmounted, so a router both use stays started. `router`, or a
+ * `linkRoutes` in `plugins`, must be at the next page's location: built with the `location` the
+ * navigation goes to. Rejects, leaving the page shown as it is, when the container is missing or
+ * a component is not given or does not load. */
 export declare function renderPage(layout: IslandComponent, components: Record<string, IslandComponent>, record: PageRecord, options?: RenderPageOptions): Promise<App>;

package/dist/client.js

@@ -571,10 +571,10 @@ export async function mountPage(layout, components, options = {}) {
  * document: load the components it names (and no others), render the app `createPageApp` builds
  * with `hydrate: false` into a copy of the container with no children, wait for the router, put the
  * copy in the container's place, mount, and then unmount `previous`. The next app is mounted
- * before the previous one is unmounted, so a router both use stays started. `router` must be at the
- * next page's location: `linkRouter` with the `location` the navigation goes to. Rejects, leaving
- * the page shown as it is, when the container is missing or a component is not given or does not
- * load. */
+ * before the previous one is unmounted, so a router both use stays started. `router`, or a
+ * `linkRoutes` in `plugins`, must be at the next page's location: built with the `location` the
+ * navigation goes to. Rejects, leaving the page shown as it is, when the container is missing or
+ * a component is not given or does not load. */
 export async function renderPage(layout, components, record, options = {}) {
     const container = containerOf(options);
     for (const text of options.loads ?? [])

package/dist/compiler.js

@@ -2,7 +2,7 @@ import { mkdirSync, readdirSync, readFileSync, rmSync, writeFileSync } from "nod
 import { basename, join, resolve } from "node:path";
 import { relativePath } from "./paths.js";
 import { CONFIG_FILE, loadConfig } from "./config.js";
-import { ctx, JS_DATE, tyOfName } from "./context.js";
+import { ctx, JS_DATE, templateComments, tyOfName } from "./context.js";
 import { refuseUnusedUnions } from "./enums.js";
 import { failIn, snake } from "./model.js";
 import { GenError, GenErrors } from "./errors.js";
@@ -46,6 +46,7 @@ function generateAll(root, config, sources, options) {
     ctx.unions = new Map(Object.entries(config.unions ?? {}));
     ctx.mappedUnions = new Map();
     ctx.builders = config.builders ?? true;
+    ctx.comments = templateComments(config);
     ctx.clientDirectives = new Set(config.clientDirectives ?? []);
     ctx.rootDir = root;
     ctx.vnodeTag = null;

package/dist/component.js

@@ -309,7 +309,7 @@ export function refuseOptionsApi(comp, script, isChild) {
  * further than its `<script>`, `optionsApi`, for `refuseOptionsApi` once every component is read. */
 export function readComponent(file, root, name = basename(file, ".vue")) {
     const source = readSource(file);
-    const { descriptor, errors } = parseSfc(source, { filename: file });
+    const { descriptor, errors } = parseSfc(source, { filename: file, templateParseOptions: { comments: ctx.comments } });
     const rel = relativePath(root, file);
     const comp = blankComponent(name, snake(name), rel);
     comp.source = source;
@@ -451,7 +451,7 @@ export function readComponent(file, root, name = basename(file, ".vue")) {
         filename: file,
         ...(claim((p) => p.templateOptions?.(comp)) ?? { id: name, scoped: false, slotted: false, ssrCssVars: [], isProd: true }),
         ssr: true,
-        compilerOptions: { ...(script ? { bindingMetadata: script.bindings } : {}), sourceMap: true, nodeTransforms: [mergedControls(controls)] },
+        compilerOptions: { ...(script ? { bindingMetadata: script.bindings } : {}), comments: ctx.comments, sourceMap: true, nodeTransforms: [mergedControls(controls)] },
     });
     const kids = (n) => n.children.filter((c) => c.type !== 3 && !(c.type === 2 && !c.content.trim()));
     const roots = descriptor.template.ast ? kids(descriptor.template.ast) : [];

package/dist/conditional.js

@@ -1,10 +1,10 @@
-import { absence, enumOf, fail, FLOAT, joinAbsence, joinTy, literalsOf, literalTy, nothing, refusalAt, sameTy, STR, withAbsence } from "./model.js";
+import { absence, enumOf, fail, FLOAT, joinAbsence, joinTy, literalsOf, literalTy, neverEmpty, nothing, refusalAt, sameTy, STR, withAbsence } from "./model.js";
 import { GenError } from "./errors.js";
 import { annotatedStr, exactlyEnum, intoEnum, knownLiteral } from "./enums.js";
 import { ctx } from "./context.js";
-import { atom, bare, enclosed, occurrences, strArg } from "./parens.js";
+import { atom, bare, condition, enclosed, occurrences, strArg } from "./parens.js";
 import { collected, sliced, typedEmpty, untypedEmpty } from "./lists.js";
-import { asCow, isTemporary, loneOf } from "./strings.js";
+import { asCow, isTemporary, loneOf, piecesOf } from "./strings.js";
 import { asF64, intFromF64, isCast, isNumber } from "./numbers.js";
 import { choice, known, literalNarrowing, narrowTo, presence, truthTested, truthy } from "./narrowing.js";
 import { ownedStruct, ownedStructs } from "./objects.js";
@@ -56,7 +56,7 @@ function branches(s, n, t) {
     const literals = p ? null : literalNarrowing(s, n.test);
     let a = expr(p && !p.negated ? narrowTo(s, p, name) : (literals?.yes ?? s), n.consequent);
     let b = expr(p && p.negated ? narrowTo(s, p, name) : (literals?.no ?? s), n.alternate);
-    if (sameTy(a.ty, b.ty) && a.code === b.code && (!name || !occurrences(a.code, name)))
+    if (sameTy(a.ty, b.ty) && neverEmpty(a.ty) === neverEmpty(b.ty) && a.code === b.code && (!name || !occurrences(a.code, name)))
         return a;
     const placed = (v) => (["struct", "child", "record"].includes(v.ty.k) && /^\w+(?:\.[\w#]+)+$/.test(v.code) ? { ...v, code: `&${v.code}` } : v);
     [a, b] = [placed(a), placed(b)];
@@ -65,7 +65,14 @@ function branches(s, n, t) {
         a = { ...a, ty: b.ty };
     if (emptyB && a.ty.k === "list")
         b = { ...b, ty: a.ty };
-    return choiceOf({ comp, n, a, b, emptyA, emptyB, choose: chooser(t, p, name, a), lone: loneOf(a, b) });
+    const [x, y] = [a, b];
+    const head = () => {
+        if (!p)
+            return { test: condition(truthy(t)), yes: x, no: y };
+        const [present, absent] = p.negated ? [y, x] : [x, y];
+        return { test: occurrences(present.code, name) ? p.pattern(name) : condition(p.present), yes: present, no: absent };
+    };
+    return choiceOf({ comp, n, a, b, emptyA, emptyB, choose: chooser(t, p, name, a), head, lone: loneOf(a, b) });
 }
 function chooser(t, p, name, a) {
     const second = (code) => (a.ty.k === "str" ? strArg(code) : bare(code));
@@ -90,7 +97,9 @@ function choiceOf(c) {
     if (owned !== null)
         return owned;
     if (sameTy(a.ty, b.ty) && a.ty.k === "str" && (isTemporary(a) || isTemporary(b))) {
-        return { code: `&*(${choose(asCow(a), asCow(b))})`, ty: STR, ...lone };
+        const code = `&*(${choose(asCow(a), asCow(b))})`;
+        const joins = (v) => piecesOf(v) !== undefined || v.branches?.of === v.code;
+        return { code, ty: STR, ...lone, ...(joins(a) || joins(b) ? { branches: { of: code, ...c.head() } } : {}) };
     }
     if (sameTy(a.ty, b.ty) && a.ty.k === "list" && a.ty.of.k !== "undef")
         return listChoice(c);
@@ -174,7 +183,7 @@ function pickedBy(v, pick) {
 function ownedChoice(comp, a, b, n) {
     const base = (ty) => (ty.k === "opt" ? ty.of : nothing(ty) ? null : ty);
     const [ba, bb] = [base(a.ty), base(b.ty)];
-    const of = ba ?? bb;
+    const of = ba !== null && bb !== null ? joinTy(ba, bb) : (ba ?? bb);
     if (of === null || (ba !== null && bb !== null && !sameTy(ba, bb)))
         return null;
     const ty = withAbsence(of, joinAbsence(absence(a.ty), absence(b.ty)));

package/dist/config.d.ts

@@ -99,6 +99,10 @@ export interface Config {
      * default) for `vite build`, `false` for the dev server. It decides the names of the CSS
      * variables `v-bind()` in `<style>` sets: a hash in production, the expression in development. */
     isProduction?: boolean;
+    /** Whether the HTML comments of templates render, as `@vitejs/plugin-vue`'s
+     * `template.compilerOptions.comments`: by default as Vue decides it, kept when `isProduction` is
+     * `false` and left out when it is `true`. */
+    comments?: boolean;
     /** CSS modules (`<style module>`): how Vite's `css.modules` names their classes, which ferrovue
      * computes as postcss-modules does. Without it, `<style module>` is refused. */
     cssModules?: {