@valancex/common 0.12.0 → 0.13.0

package/dist/vocabulary.d.ts

@@ -1,9 +1,30 @@
 import type { WebPrimitives } from "@valancex/port-web";
-export interface Vocabulary {
+/**
+ * A target's vocabulary has one of two forms. The web's is a table of PORT Web's realizations, from which the manifest is derived (`tags`). Any other target's is a MESH manifest, as data
+ * (`components`): the PORT ships it (the Desktop PORT's `vocabulary.json` and `content.json`), and the build reads it as it is.
+ */
+export interface WebVocabulary {
     /** The target's id (`web`). */
     readonly target: string;
     /** The tags, each with its props and events. */
     readonly tags: WebPrimitives;
+    /**
+     * The props a template may leave out, by tag. PORT Web's table says how a prop is realized, not whether it is required, so the manifest derived from it makes every prop required but a boolean
+     * 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>>>;
 }
+export interface ManifestVocabulary {
+    readonly target: string;
+    /** MESH manifest components: each with its props and events. */
+    readonly components: Readonly<Record<string, unknown>>;
+}
+export type Vocabulary = WebVocabulary | ManifestVocabulary;
+/** The names a template may write as a primitive in this vocabulary. */
+export declare const namesOf: (vocabulary: Vocabulary) => ReadonlyArray<string>;
+/** A vocabulary that is a MESH manifest (or several: their components are merged, and a name may not be in two). */
+export declare const fromManifests: (target: string, ...manifests: ReadonlyArray<{
+    readonly components: Readonly<Record<string, unknown>>;
+}>) => ManifestVocabulary;
 /** The web's vocabulary: HTML elements, with `class`, `theme`, `id` and `aria-*` as styling and accessibility hooks. */
-export declare const webVocabulary: Vocabulary;
+export declare const webVocabulary: WebVocabulary;

package/dist/vocabulary.js

@@ -1,3 +1,28 @@
 import { primitives } 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). */
+export const fromManifests = (target, ...manifests) => {
+    const components = {};
+    for (const manifest of manifests) {
+        for (const [name, each] of Object.entries(manifest.components)) {
+            if (name in components) {
+                throw new Error(`the ${target} vocabulary declares "${name}" twice`);
+            }
+            components[name] = each;
+        }
+    }
+    return { target, components };
+};
 /** The web's vocabulary: HTML elements, with `class`, `theme`, `id` and `aria-*` as styling and accessibility hooks. */
-export const webVocabulary = { target: "web", tags: primitives };
+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"],
+    },
+};

package/dist/web-app.d.ts

@@ -0,0 +1,6 @@
+import type { Plugin } from "@valancex/valance/web/plugin";
+import type { AppState, Built } from "./app.js";
+import type { DefinedApp } from "./index.js";
+import type { Content } from "./model.js";
+/** The plugin that makes the application a website: its tags, its URL policy, and its document head. */
+export declare const plugin: (content: Content, built: Built, author?: DefinedApp) => Plugin<AppState>;

package/dist/web-app.js

@@ -0,0 +1,20 @@
+import { titleFor } from "./app.js";
+import { pageAt } from "./scope.js";
+import { primitives } from "./primitives.js";
+import { routes } from "./routes.js";
+/** The plugin that makes the application a website: its tags, its URL policy, and its document head. */
+export const plugin = (content, built, author) => ({
+    name: "valance-app",
+    primitives,
+    routes: routes(content),
+    head: (state) => {
+        const page = pageAt(content, state.page);
+        const shown = page ?? { description: "" };
+        const canonical = content.site.url === "" || page === undefined ? [] : [{ rel: "canonical", href: `${content.site.url}${content.site.base}${page.path.replace(/^\//, "")}` }];
+        return {
+            title: titleFor(content, page, state, author),
+            meta: shown.description === "" ? [] : [{ name: "description", content: shown.description }],
+            links: [...built.styles.map((href) => ({ rel: "stylesheet", href })), ...canonical],
+        };
+    },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@valancex/common",
-  "version": "0.12.0",
+  "version": "0.13.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"
     },
+    "./desktop": {
+      "types": "./dist/desktop.d.ts",
+      "default": "./dist/desktop.js"
+    },
     "./http": {
       "types": "./dist/http.d.ts",
       "default": "./dist/http.js"
@@ -58,8 +62,9 @@
   "dependencies": {
     "@valancex/mesh-runtime": "^0.11.0",
     "@valancex/nexus": "^0.12.0",
-    "@valancex/port-web": "^0.4.0",
-    "@valancex/valance": "^0.12.0"
+    "@valancex/port-web": "^0.6.1",
+    "@valancex/router": "^0.13.0",
+    "@valancex/valance": "^0.13.0"
   },
   "peerDependencies": {
     "effect": "^3.10.0"