ferrovue 0.2.0 → 0.4.0

package/dist/testing.d.ts

@@ -1,3 +1,4 @@
 import type { Component } from "vue";
 export { fixtureApp, readFixture, routeRecords, type Fixture, type RouteEntry, type RouterOptions } from "./fixture.ts";
+/** Give a component compiled for the browser the `ssrRender` its SSR build would have. */
 export declare function attachSsrRender(file: string, name: string, component: Component): void;

package/dist/testing.js

@@ -1,19 +1,12 @@
-/* What a conformance suite needs from Vue: a component's real server render, and an app that
- * renders one fixture (`fixture.ts`, which describes a fixture's keys). */
 import { readFileSync } from "node:fs";
 import { compileScript, compileTemplate, parse as parseSfc } from "@vue/compiler-sfc";
 import * as vue from "vue";
 import * as serverRenderer from "vue/server-renderer";
 export { fixtureApp, readFixture, routeRecords } from "./fixture.js";
-/* A bundler compiles a `.vue` file for the browser, and `renderToString` on a component without
- * `ssrRender` falls back to rendering its virtual DOM — a different path with different output
- * (attribute order, `v-model` state, comment markers). So each component is given the `ssrRender`
- * its SSR build would have, which is also what the generator translates. */
+/** Give a component compiled for the browser the `ssrRender` its SSR build would have. */
 export function attachSsrRender(file, name, component) {
     const { descriptor } = parseSfc(readFileSync(file, "utf8"), { filename: file });
     const script = compileScript(descriptor, { id: name });
-    // A `<style scoped>` component's id is the one `@vitejs/plugin-vue` gave it, which its client
-    // build carries and which ferrovue computes the same way.
     const scopeId = component.__scopeId;
     if (!scopeId && descriptor.styles.some((st) => st.scoped)) {
         throw new Error(`${file}: a \`<style scoped>\` component without \`__scopeId\`: load it through \`@vitejs/plugin-vue\``);

package/dist/types.d.ts

@@ -1,6 +1,8 @@
 declare const trusted: unique symbol;
+/** HTML already made safe: the only type `v-html` may render. */
 export type TrustedHtml = string & {
     readonly [trusted]: true;
 };
+/** A number that may have a fractional part: an `f64` on the server, where a plain `number` is an `i64`. */
 export type Float = number;
 export {};

package/dist/typescript.d.ts

@@ -1,19 +1,10 @@
 import { type Component, type Field, type N, type Struct, type Ty } from "./model.ts";
-/** The local names \`TrustedHtml\` and \`Float\` are imported under from \`ferrovue/types\`. */
 export declare function typesImports(comp: Component, body: N[]): void;
 export declare function tyOfTs(comp: Component, t: N, structs: Map<string, Struct>, seen?: Set<string>): Ty;
-/** Every local name an interface or object type alias declares a struct for, and every other
- * alias: what a type in that block may name. */
 export declare function declareTypes(comp: Component, body: N[], structs: Map<string, Struct>, aliases: Map<string, N>): N[];
-/** A relative import's file, resolved as a bundler resolves a TypeScript import. */
 export declare function resolveImport(fromFile: string, spec: string): string | null;
-/** A shared `.ts` file of types, read once: its interfaces and object types become structs in
- * `types.rs`, its other aliases are resolved where they are used. */
 export declare function readTypeFile(file: string): void;
-/** A type read in the file that declares it, marked with where it lives for readers elsewhere. */
 export declare function markHome(ty: Ty, home: string): Ty;
-/** Where a struct type is declared: its fields, the component whose types its fields name, and
- * the path the generated code names it by. */
 export declare function lookupStruct(comp: Component, ty: Ty & {
     k: "struct";
 }): {
@@ -22,10 +13,6 @@ export declare function lookupStruct(comp: Component, ty: Ty & {
     path: string;
 };
 export declare function structOf(comp: Component, name: string, members: N[], structs: Map<string, Struct>): Struct;
-/** The type literal (or interface) `defineProps<...>()` was given, seen through `withDefaults`. */
 export declare function definePropsType(call: N): N | null;
-/** The `default` of each prop in the runtime declaration `compileScript` wrote, by prop name. */
 export declare function runtimeDefaults(comp: Component, content: string): Map<string, N>;
-/** A prop's default as a Rust value of its type: a literal, or an empty list from `() => []`. */
 export declare function defaultValue(comp: Component, f: Field, node: N): string;
-export declare function markStore(ty: Ty): Ty;

package/dist/typescript.js

@@ -1,12 +1,10 @@
-/* TypeScript types read as Rust ones: props, interfaces, aliases, shared type files, defaults. */
 import { parse as parseJs } from "@babel/parser";
 import { readFileSync, statSync } from "node:fs";
-import { dirname, join, relative, resolve } from "node:path";
-import { BOOL, fail, FLOAT, INT, opt, RUST_PRELUDE, rustStr, sameTy, snake, STR, tagAst } from "./model.js";
+import { basename, dirname, join, relative, resolve } from "node:path";
+import { blankComponent, BOOL, fail, FLOAT, INT, opt, RUST_PRELUDE, rustStr, sameTy, snake, STR, tagAst } from "./model.js";
 import { CONFIG_FILE, ctx, TYPES_MODULE } from "./context.js";
 import { childOf } from "./expr.js";
-import { storeHome } from "./stores.js";
-/** The local names \`TrustedHtml\` and \`Float\` are imported under from \`ferrovue/types\`. */
+import { claim } from "./plugin.js";
 export function typesImports(comp, body) {
     for (const s of body) {
         if (s.type !== "ImportDeclaration" || s.source.value !== TYPES_MODULE)
@@ -35,7 +33,6 @@ export function tyOfTs(comp, t, structs, seen = new Set()) {
         case "TSParenthesizedType":
             return tyOfTs(comp, t.typeAnnotation, structs, seen);
         case "TSTypeLiteral": {
-            // `{ [key: string]: T }`, which is `Record<string, T>`. Any other object type is an interface.
             const [sig] = t.members;
             const key = sig?.parameters?.[0]?.typeAnnotation?.typeAnnotation;
             if (t.members.length === 1 && sig.type === "TSIndexSignature" && key?.type === "TSStringKeyword" && sig.typeAnnotation) {
@@ -44,12 +41,10 @@ export function tyOfTs(comp, t, structs, seen = new Set()) {
             return fail(comp, "an object type in place: declare it as an interface, or as `{ [key: string]: T }` for a dictionary", t);
         }
         case "TSTypeOperator":
-            // `readonly string[]`: the same list, which the server never writes to anyway.
             if (t.operator === "readonly")
                 return tyOfTs(comp, t.typeAnnotation, structs, seen);
             break;
         case "TSLiteralType":
-            // A literal type is a value of its kind: `"sm"` a string, `3` a number.
             if (t.literal.type === "StringLiteral" || t.literal.type === "TemplateLiteral")
                 return STR;
             if (t.literal.type === "NumericLiteral")
@@ -58,7 +53,6 @@ export function tyOfTs(comp, t, structs, seen = new Set()) {
                 return BOOL;
             break;
         case "TSUnionType": {
-            // `"sm" | "md"` is a string; `T | undefined` is an optional `T`. `null` is a different value.
             const parts = t.types.filter((u) => u.type !== "TSUndefinedKeyword");
             if (t.types.some((u) => u.type === "TSNullKeyword" || (u.type === "TSLiteralType" && u.literal.type === "NullLiteral"))) {
                 return fail(comp, "`null` in a type: use `undefined`, which is what an absent value is", t);
@@ -73,11 +67,9 @@ export function tyOfTs(comp, t, structs, seen = new Set()) {
             const name = t.typeName.type === "Identifier" ? t.typeName.name : undefined;
             if (name === undefined)
                 break;
-            // `Array<T>` and `ReadonlyArray<T>`, as `T[]`.
             if ((name === "Array" || name === "ReadonlyArray") && t.typeParameters?.params?.length === 1) {
                 return { k: "list", of: tyOfTs(comp, t.typeParameters.params[0], structs, seen) };
             }
-            // `Record<string, T>`, an object used as a dictionary.
             if (name === "Record" && t.typeParameters?.params?.length === 2) {
                 const [key, value] = t.typeParameters.params;
                 if (key.type !== "TSStringKeyword")
@@ -110,8 +102,6 @@ export function tyOfTs(comp, t, structs, seen = new Set()) {
     }
     return fail(comp, `unsupported prop type \`${t.type}\``, t);
 }
-/** A dictionary's type: its values strings, numbers, booleans, objects or lists of those. A value
- * may not be optional: JSON has no `undefined` to hold. */
 function recordOf(comp, value, structs, seen) {
     const of = tyOfTs(comp, value, structs, seen);
     const plain = (t) => ["str", "int", "float", "bool", "struct", "child"].includes(t.k) || (t.k === "list" && plain(t.of));
@@ -119,8 +109,6 @@ function recordOf(comp, value, structs, seen) {
         fail(comp, "a `Record`'s values are strings, numbers, booleans, objects or lists of those", value);
     return { k: "record", of };
 }
-/** Every local name an interface or object type alias declares a struct for, and every other
- * alias: what a type in that block may name. */
 export function declareTypes(comp, body, structs, aliases) {
     const decls = [];
     for (const st of body) {
@@ -128,7 +116,6 @@ export function declareTypes(comp, body, structs, aliases) {
         if (d?.type === "TSInterfaceDeclaration")
             decls.push({ name: d.id.name, members: d.body.body, node: d });
         else if (d?.type === "TSTypeAliasDeclaration") {
-            // An object type is a struct — but for a dictionary, `{ [key: string]: T }`, an alias of its own.
             const dictionary = d.typeAnnotation.members?.some((m) => m.type === "TSIndexSignature");
             if (d.typeAnnotation.type === "TSTypeLiteral" && !dictionary)
                 decls.push({ name: d.id.name, members: d.typeAnnotation.members, node: d });
@@ -144,7 +131,6 @@ export function declareTypes(comp, body, structs, aliases) {
     }
     return decls;
 }
-/** A relative import's file, resolved as a bundler resolves a TypeScript import. */
 export function resolveImport(fromFile, spec) {
     if (!spec.startsWith("."))
         return null;
@@ -155,20 +141,16 @@ export function resolveImport(fromFile, spec) {
                 return candidate;
         }
         catch {
-            // not this one
         }
     }
     return null;
 }
-/** A shared `.ts` file of types, read once: its interfaces and object types become structs in
- * `types.rs`, its other aliases are resolved where they are used. */
 export function readTypeFile(file) {
     if (ctx.typeRead.has(file))
         return;
     ctx.typeRead.add(file);
     const rel = relative(ctx.rootDir, file);
-    const home = storeHome(rel);
-    home.structs = ctx.typeStructs;
+    const home = blankComponent(basename(rel), "types", rel, ctx.typeStructs);
     home.aliases = ctx.typeAliases;
     home.source = readFileSync(file, "utf8");
     const body = parseJs(home.source, { sourceType: "module", plugins: ["typescript"] }).program.body;
@@ -190,20 +172,17 @@ export function readTypeFile(file) {
         ctx.typeStructs.set(d.name, st);
     }
 }
-/** A type read in the file that declares it, marked with where it lives for readers elsewhere. */
 export function markHome(ty, home) {
-    if (ty.k === "struct" && !ty.store && !ty.home && ty.name !== "Props")
+    if (ty.k === "struct" && !claim((p) => p.struct?.(ty)) && !ty.home && ty.name !== "Props")
         return { ...ty, home };
     if (ty.k === "opt" || ty.k === "list" || ty.k === "record")
         return { ...ty, of: markHome(ty.of, home) };
     return ty;
 }
-/** Where a struct type is declared: its fields, the component whose types its fields name, and
- * the path the generated code names it by. */
 export function lookupStruct(comp, ty) {
-    // Named from the module being written: plainly within its own, by path from any other.
-    if (ty.store)
-        return { st: ctx.storeStructs.get(ty.name), owner: comp, path: comp.module === "stores" ? "" : "super::stores::" };
+    const own = claim((p) => p.struct?.(ty));
+    if (own)
+        return { st: own.st, owner: comp, path: comp.module === own.module ? "" : `super::${own.module}::` };
     if (ty.home === "types")
         return { st: ctx.typeStructs.get(ty.name), owner: comp, path: comp.module === "types" ? "" : "super::types::" };
     if (ty.home !== undefined && ty.home !== comp.name) {
@@ -227,7 +206,6 @@ export function structOf(comp, name, members, structs) {
     }
     return { name, fields };
 }
-/** The type literal (or interface) `defineProps<...>()` was given, seen through `withDefaults`. */
 export function definePropsType(call) {
     if (call?.type === "CallExpression" && call.callee.type === "Identifier" && call.callee.name === "withDefaults") {
         return definePropsType(call.arguments[0]);
@@ -239,7 +217,6 @@ export function definePropsType(call) {
     }
     return null;
 }
-/** The `default` of each prop in the runtime declaration `compileScript` wrote, by prop name. */
 export function runtimeDefaults(comp, content) {
     const out = new Map();
     let program;
@@ -249,7 +226,6 @@ export function runtimeDefaults(comp, content) {
     catch {
         return out;
     }
-    /** An object literal's properties, with `...{ … }` spreads opened, as `defineModel` writes them. */
     const props = (o) => o?.type !== "ObjectExpression"
         ? []
         : o.properties.flatMap((p) => (p.type === "SpreadElement" ? props(p.argument) : [p]));
@@ -257,7 +233,6 @@ export function runtimeDefaults(comp, content) {
         if (!n || typeof n !== "object")
             return;
         if (n.type === "ObjectProperty" && !n.computed && (n.key.name ?? n.key.value) === "props") {
-            // `props: { … }`, or `_mergeModels({ … }, { … })` when there is a `defineModel`.
             const objects = n.value.type === "CallExpression" ? n.value.arguments : [n.value];
             for (const o of objects) {
                 for (const p of props(o)) {
@@ -284,7 +259,6 @@ export function runtimeDefaults(comp, content) {
     void comp;
     return out;
 }
-/** A prop's default as a Rust value of its type: a literal, or an empty list from `() => []`. */
 export function defaultValue(comp, f, node) {
     const of = f.ty.k === "opt" ? f.ty.of : f.ty;
     if (of.k === "str" && node.type === "StringLiteral")
@@ -301,10 +275,3 @@ export function defaultValue(comp, f, node) {
     }
     return fail(comp, `the default of \`${f.js}\` must be a literal of its type, or \`() => []\` for a list`, node);
 }
-export function markStore(ty) {
-    if (ty.k === "struct")
-        return { ...ty, store: true };
-    if (ty.k === "opt" || ty.k === "list" || ty.k === "record")
-        return { ...ty, of: markStore(ty.of) };
-    return ty;
-}

package/dist/vite.d.ts

@@ -20,4 +20,5 @@ export declare function scopeIdMismatch(root: string, vue: {
     mode: string;
     root: string;
 } | null): string | null;
+/** The Rust renderers regenerated by a Vite build and its dev server, and the `ferrovue/islands` module. */
 export default function ferrovue(options?: FerrovueOptions): Plugin;

package/dist/vite.js

@@ -1,12 +1,3 @@
-/* `ferrovue/vite`: the Rust renderers regenerated as part of a Vite build and its dev server.
- *
- *   import ferrovue from "ferrovue/vite";
- *   export default defineConfig({ plugins: [vue(), ferrovue()] });
- *
- * A build regenerates them once and fails on a construct ferrovue refuses, naming the line in the
- * `.vue` file. The dev server regenerates them whenever a component, store, type file, the routes
- * or the configuration changes, and shows a refusal in its error overlay. Only files whose text
- * changed are rewritten, so `cargo watch` rebuilds no more than it must. */
 import { readdirSync, readFileSync } from "node:fs";
 import { join, relative, resolve, sep } from "node:path";
 import { CONFIG_FILE, GenError, loadConfig, write } from "./compiler.js";
@@ -21,7 +12,6 @@ export function affects(root, file) {
         out = loadConfig(root).out;
     }
     catch {
-        // A broken configuration ignores nothing; regenerating reports it.
     }
     const parts = rel.split(sep);
     if (parts.some((p) => p === "node_modules" || p === "target" || p === ".git" || p === "dist"))
@@ -54,19 +44,46 @@ export function scopeIdMismatch(root, vue) {
         files = readdirSync(join(root, config.components)).filter((f) => f.endsWith(".vue"));
     }
     catch {
-        // No components: generating reports it.
     }
     if (!files.some((f) => /<style\b[^>]*\bscoped\b/.test(readFileSync(join(root, config.components, f), "utf8"))))
         return null;
     return `\`<style scoped>\` ids: @vitejs/plugin-vue hashes "${vue.mode}" from ${vue.root}, ${CONFIG_FILE} "${mode}" from ${viteRoot}; set \`scopeId\` and \`viteRoot\` to match, or plugin-vue's \`features.componentIdGenerator\``;
 }
+const ISLANDS = "ferrovue/islands";
+const ISLANDS_ID = `\0${ISLANDS}`;
+function islandsModule(root, islands) {
+    const entries = Object.entries(islands).map(([name, file]) => `  ${JSON.stringify(name)}: () => import(${JSON.stringify(resolve(root, file).split(sep).join("/"))}),`);
+    return `export default {\n${entries.join("\n")}\n};\n`;
+}
+/** The Rust renderers regenerated by a Vite build and its dev server, and the `ferrovue/islands` module. */
 export default function ferrovue(options = {}) {
     const root = resolve(options.root ?? process.cwd());
-    const regenerate = () => write(root, loadConfig(root));
+    let islands = null;
+    const regenerate = () => {
+        const written = write(root, loadConfig(root));
+        islands = written.islands;
+        return written;
+    };
     let vue = null;
     let building = true;
     return {
         name: "ferrovue",
+        enforce: "pre",
+        resolveId(id) {
+            return id === ISLANDS ? ISLANDS_ID : null;
+        },
+        load(id) {
+            if (id !== ISLANDS_ID)
+                return null;
+            try {
+                return islandsModule(root, islands ?? regenerate().islands);
+            }
+            catch (e) {
+                if (e instanceof GenError || e instanceof SyntaxError)
+                    this.error(e.message);
+                throw e;
+            }
+        },
         configResolved(config) {
             vue = vueScopeIds(config);
             building = config.command === "build";
@@ -74,8 +91,6 @@ export default function ferrovue(options = {}) {
         buildStart() {
             try {
                 regenerate();
-                // A build whose styles would not apply to the server's pages fails, as a refusal does; the
-                // dev server warns.
                 const mismatch = scopeIdMismatch(root, vue);
                 if (mismatch && building)
                     this.error(`ferrovue: ${mismatch}`);
@@ -94,10 +109,16 @@ export default function ferrovue(options = {}) {
                 if (!affects(root, file))
                     return;
                 try {
+                    const before = JSON.stringify(islands);
                     const { changed, removed } = regenerate();
                     if (changed.length || removed.length) {
                         server.config.logger.info(`ferrovue: ${changed.length} changed, ${removed.length} removed`, { timestamp: true });
                     }
+                    const loaded = server.moduleGraph.getModuleById(ISLANDS_ID);
+                    if (loaded && JSON.stringify(islands) !== before) {
+                        server.moduleGraph.invalidateModule(loaded);
+                        server.ws.send({ type: "full-reload" });
+                    }
                 }
                 catch (e) {
                     if (!(e instanceof GenError || e instanceof SyntaxError))

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ferrovue",
-  "version": "0.2.0",
+  "version": "0.4.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": {
@@ -29,6 +29,10 @@
   ],
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./compiler": {
       "types": "./dist/compiler.d.ts",
       "default": "./dist/compiler.js"
     },
@@ -44,16 +48,21 @@
       "types": "./dist/client.d.ts",
       "default": "./dist/client.js"
     },
+    "./islands": {
+      "types": "./dist/islands.d.ts",
+      "default": "./dist/islands.js"
+    },
     "./vite": {
       "types": "./dist/vite.d.ts",
       "default": "./dist/vite.js"
     }
   },
+  "sideEffects": false,
   "bin": {
     "ferrovue": "./dist/cli.js"
   },
   "scripts": {
-    "build": "tsc -p tsconfig.build.json",
+    "build": "node -e \"require('node:fs').rmSync('dist', { recursive: true, force: true })\" && tsc -p tsconfig.build.json",
     "prepack": "pnpm run build && cp ../../README.md ../../LICENSE-MIT ../../LICENSE-APACHE ."
   },
   "dependencies": {

package/dist/i18n.d.ts

@@ -1,27 +0,0 @@
-import { type N, type Scope, type Val } from "./model.ts";
-/** A locale's messages, each parsed by vue-i18n's own message compiler, by dotted key. */
-export interface LocaleMessages {
-    name: string;
-    file: string;
-    messages: Map<string, N>;
-}
-/** The configured vue-i18n setup, read once per run. */
-export interface I18nSetup {
-    /** The locale files' directory, as the configuration names it. */
-    dir: string;
-    locales: LocaleMessages[];
-    /** The locale a fixture renders in when it names none, and the fallbacks in order. */
-    locale: string;
-    fallback: string[];
-}
-/** Every message of every `*.json` locale file in the directory: nested objects joined with dots,
- * as vue-i18n resolves a path — a nested key first, then a flat key of the same spelling. */
-export declare function readLocales(root: string, config: {
-    messages: string;
-    locale?: string;
-    fallbackLocale?: string | string[];
-}): I18nSetup;
-export declare function i18nSource(setup: I18nSetup): string;
-/** `t(key)`, `t(key, plural)`, `t(key, { named })`, `t(key, [list])`, `t(key, { named }, plural)`:
- * the message translated in the request's locale. */
-export declare function translate(s: Scope, args: N[], n: N): Val;

package/dist/router.d.ts

@@ -1,17 +0,0 @@
-import { type N, type Scope, type Val } from "./model.ts";
-import { type RouteDef } from "./context.ts";
-import { Emitter } from "./emitter.ts";
-export declare const ROUTER_LINK_PROPS: Set<string>;
-/** `<RouterLink>` props that change only what a click does, which the server does not render. */
-export declare const ROUTER_LINK_INERT: Set<string>;
-/** The parameter names of a route path, in order. */
-export declare function routeParams(path: string): string[];
-/** A value written into a URL — a parameter or a query value — as the `&str` vue-router stringifies. */
-export declare function urlText(s: Scope, v: Val, n: N): string;
-/** \`let fv_link = …;\`: a \`<RouterLink>\`'s \`to\` resolved from the reader's route. */
-export declare function resolveLink(s: Scope, e: Emitter, to: N): void;
-/** \`<RouterLink to="...">\` as vue-router renders it: \`aria-current\` and the active classes when it
- * points where the reader is, then \`href\`, then the link's own class and attributes. */
-export declare function routerLink(s: Scope, e: Emitter, n: N): void;
-/** The routes file: vue-router paths, each a string or `{ "path", "name" }`. */
-export declare function readRoutes(root: string, file: string): RouteDef[];

package/dist/scoped.d.ts

@@ -1,10 +0,0 @@
-import type { Component } from "./model.ts";
-/** Set every component's `inherits` and `passesSlotIds`, each a least fixed point: a component's
- * slot content may be given an id when one of its outlets passes one, or forwards what the slot
- * content it sits in was given; a root may be handed ids by a scoped parent, by a parent that
- * passes on what it inherits, or by slot content that may be given an id. */
-export declare function scopeFlow(read: {
-    comp: Component;
-    ssr: string;
-    children: Map<string, string>;
-}[]): void;

package/dist/stores.d.ts

@@ -1,6 +0,0 @@
-import { type Component } from "./model.ts";
-/** The store module an import names, resolved and without its extension, when it is one. */
-export declare function storeImport(comp: Component, from: string): string | null;
-/** Every store in the configured directory, and the interfaces their files declare. */
-export declare function readStores(root: string, dir: string): void;
-export declare function storeHome(file: string): Component;