@valancex/common 0.13.0 → 0.15.0

package/dist/record.d.ts

@@ -0,0 +1,4 @@
+import type * as Valance from "@valancex/valance";
+import type { Redaction, SessionRecorder } from "@valancex/valance/replay";
+/** A recorder for the page of `program`, posting to the development server's `/__vlx/record`; it writes the last tree when the page is hidden. */
+export declare const recording: (program: Valance.Program, redact?: Redaction) => SessionRecorder;

package/dist/record.js

@@ -0,0 +1,14 @@
+import { postTo, recorder } from "@valancex/valance/replay";
+/** A recorder for the page of `program`, posting to the development server's `/__vlx/record`; it writes the last tree when the page is hidden. */
+export const recording = (program, redact) => {
+    const model = program.model;
+    const { root, templates } = program;
+    const record = recorder({
+        write: postTo("/__vlx/record"),
+        warn: (message) => console.warn(`vlx dev --record: ${message}`),
+        ...(redact === undefined ? {} : { redact }),
+        programs: () => ({ root, templates, model: typeof model === "string" ? model : JSON.stringify(model) }),
+    });
+    addEventListener("pagehide", () => void record.flush());
+    return record;
+};

package/dist/server.js

@@ -2,6 +2,7 @@ import { renderHead } from "@valancex/valance/web/plugin";
 import { renderToHtml } from "@valancex/valance/web/server";
 import { Effect } from "effect";
 import { application, stateFor } from "./app.js";
+import { earlyHead } from "./early.js";
 import { plugin } from "./web-app.js";
 import { routes } from "./routes.js";
 export { routes };
@@ -15,7 +16,7 @@ export const createRenderer = ({ content, program, author }) => {
         const boot = safe(JSON.stringify({ state: served.state, built }));
         return {
             status: table.known(pathname) ? 200 : 404,
-            html: `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">${renderHead(served.head)}</head><body><div id="app">${served.html}</div><script id="valance-boot" type="application/json">${boot}</script><script type="module" src="${built.script}"></script></body></html>`,
+            html: `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">${built.wasm === undefined ? "" : `<link rel="modulepreload" href="${built.script}">`}${earlyHead(built)}${renderHead(served.head)}</head><body><div id="app" data-vlx="starting">${served.html}</div><script id="valance-boot" type="application/json">${boot}</script><script type="module" src="${built.script}"></script></body></html>`,
         };
     };
 };

package/dist/vocabulary.d.ts

@@ -13,6 +13,30 @@ export interface WebVocabulary {
      * one; this is the author-facing rule beside it. An absent prop is not in the render tree, and PORT Web realizes an absent prop as no attribute (or the element's own initial value).
      */
     readonly optional?: Readonly<Record<string, ReadonlyArray<string>>>;
+    /**
+     * What each tag's props and events are, as a specification states them: the type of a prop and whether a use must write it, which the table alone cannot say. Where present it settles the manifest
+     * entry's props and events (the table still says how they are realized); `optional` then applies to what it does not cover.
+     */
+    /** Tags that were renamed, old to new: a template that writes the old one is told the new one. */
+    readonly renamed?: Readonly<Record<string, string>>;
+    /** Props that were renamed, by tag, old to new: a template that writes the old one is told the new one. */
+    readonly renamedProps?: Readonly<Record<string, Readonly<Record<string, string>>>>;
+    readonly rules?: {
+        readonly named: ReadonlyArray<string>;
+        /** The tags that are a modal layer: none is inside another (`nested-modal`). */
+        readonly modal?: ReadonlyArray<string>;
+        readonly only: Readonly<Record<string, ReadonlyArray<string>>>;
+        readonly within: Readonly<Record<string, ReadonlyArray<string>>>;
+    };
+    readonly declared?: Readonly<Record<string, {
+        readonly props: Readonly<Record<string, {
+            readonly type: Readonly<Record<string, unknown>>;
+            readonly required: boolean;
+        }>>;
+        readonly events: Readonly<Record<string, {
+            readonly payload?: Readonly<Record<string, unknown>>;
+        }>>;
+    }>>;
 }
 export interface ManifestVocabulary {
     readonly target: string;

package/dist/vocabulary.js

@@ -1,4 +1,4 @@
-import { primitives } from "./primitives.js";
+import { declared, primitives, renamed, renamedProps, rules } from "./primitives.js";
 /** The names a template may write as a primitive in this vocabulary. */
 export const namesOf = (vocabulary) => Object.keys("tags" in vocabulary ? vocabulary.tags : vocabulary.components);
 /** A vocabulary that is a MESH manifest (or several: their components are merged, and a name may not be in two). */
@@ -18,11 +18,8 @@ export const fromManifests = (target, ...manifests) => {
 export const webVocabulary = {
     target: "web",
     tags: primitives,
-    optional: {
-        // styling and accessibility hooks are the web's, and a template for both targets does not write them
-        button: ["class", "pressed"],
-        checkbox: ["label"],
-        textfield: ["label", "placeholder"],
-        heading: ["level"],
-    },
+    declared,
+    rules,
+    renamed,
+    renamedProps,
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@valancex/common",
-  "version": "0.13.0",
+  "version": "0.15.0",
   "description": "The author's side of a VALANCE application (defineApp, component, field) and the runtime the vlx build runs: the browser and server entries. What src/main.ts imports; @valancex/cli builds what it describes.",
   "keywords": [
     "valance",
@@ -32,6 +32,10 @@
       "types": "./dist/client.d.ts",
       "default": "./dist/client.js"
     },
+    "./record": {
+      "types": "./dist/record.d.ts",
+      "default": "./dist/record.js"
+    },
     "./desktop": {
       "types": "./dist/desktop.d.ts",
       "default": "./dist/desktop.js"
@@ -60,11 +64,11 @@
     "provenance": true
   },
   "dependencies": {
-    "@valancex/mesh-runtime": "^0.11.0",
-    "@valancex/nexus": "^0.12.0",
-    "@valancex/port-web": "^0.6.1",
-    "@valancex/router": "^0.13.0",
-    "@valancex/valance": "^0.13.0"
+    "@valancex/mesh-runtime": "^0.15.0 || ^0.16.0 || ^0.17.0",
+    "@valancex/nexus": "^0.14.0 || ^0.15.0 || ^0.16.0",
+    "@valancex/port-web": "^0.12.0 || ^0.13.0 || ^0.14.0",
+    "@valancex/router": "^0.15.0",
+    "@valancex/valance": "^0.15.0"
   },
   "peerDependencies": {
     "effect": "^3.10.0"