@loadbare/app 0.5.6 → 0.7.0

package/dist/hub/lb-hub.browser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lb-hub.browser.d.ts","sourceRoot":"","sources":["../../hub/lb-hub.browser.ts"],"names":[],"mappings":"AA2BA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"lb-hub.browser.d.ts","sourceRoot":"","sources":["../../hub/lb-hub.browser.ts"],"names":[],"mappings":"AA8BA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC"}

package/dist/hub/lb-hub.browser.js

@@ -1,21 +1,100 @@
 /// <reference lib="dom" />
-import { ATTR_ACTION, ATTR_CELL, ATTR_DELETE, ATTR_ERROR, ATTR_INSERT, ATTR_KEY, ATTR_NAV_LINK, ATTR_PENDING, ATTR_QUERY, ATTR_UNKNOWN_PAGE, ATTR_UPDATE, HUB_TAG_NAME, NAV_CELL_LABEL, NAV_CELL_URI, NAV_QUERY, PAGE_TEMPLATE_PREFIX, LB_DATA_ENDPOINT, LB_EVENT_NAME, LB_REQUEST_ENDPOINT, LB_REQUEST_TIMEOUT_MS, } from "../core/lb-constants";
-import { applyData } from "./lb-apply";
-export { applyData, applyTuple } from "./lb-apply";
+import { ACTION_CELL_CHANGE, ACTION_ROW_DELETE, ACTION_ROW_INSERT, ACTION_ROW_UPDATE, ATTR_ACTION, ATTR_CELL, ATTR_ERROR, ATTR_KEY_VALUE, ATTR_LIST, ATTR_NAV_LINK, ATTR_PAGE, ATTR_PENDING, ATTR_ROW, ATTR_UNKNOWN_PAGE, LB_ACTIONS, LB_RESERVED_PREFIX, HUB_TAG_NAME, NAV_CELL_LABEL, NAV_CELL_URI, NAV_ROW, LB_EVENT_NAME, LB_ENDPOINT, LB_REQUEST_TIMEOUT_MS, } from "../core/lb-constants.js";
+import { applyData, isValueControl } from "./lb-apply.js";
+export { applyData, applyRow } from "./lb-apply.js";
+/** What each operation takes from scope, and what it cannot be sent without. */
+const OPERATIONS = {
+    [ACTION_CELL_CHANGE]: {
+        fills: ["list", "key", "cell"],
+        requires: ["list", "key", "cell", "value"],
+    },
+    [ACTION_ROW_INSERT]: { fills: ["list"], requires: ["list", "values"] },
+    [ACTION_ROW_DELETE]: { fills: ["list", "key"], requires: ["list", "key"] },
+    [ACTION_ROW_UPDATE]: {
+        fills: ["list", "key"],
+        requires: ["list", "key", "values"],
+    },
+};
 /**
- * Where a click happened, in the binding vocabulary. An action carries
- * these and nothing else, so there is no channel for a browser-supplied
- * argument.
+ * Complete a request from where its element sits — see docs/TECHREF-1.0.md,
+ * "Requests". Every request passes through here, whoever built it, so a
+ * widget states what it did and never where it is.
+ *
+ * The scope field is `list` or `row`, whichever attribute scoped the nearest
+ * ancestor, so a declared action fired inside a single-row scope says so and
+ * the wire never needs a noun for the addressable thing. A field the request
+ * already carries is the dispatcher's to decide and is left as it is.
+ *
+ * False when the request cannot be sent, having said why.
  */
-function binding(el) {
-    const query = el.closest(`[${ATTR_QUERY}]`)?.getAttribute(ATTR_QUERY);
-    const key = el.closest(`[${ATTR_KEY}]`)?.getAttribute(ATTR_KEY);
-    const cell = el.getAttribute(ATTR_CELL);
-    return {
-        ...(query === null || query === undefined ? {} : { query }),
-        ...(key === null || key === undefined ? {} : { key }),
-        ...(cell === null ? {} : { cell }),
+function scope(request, el) {
+    if (!request?.action) {
+        console.warn(`lb-hub: event without an action, ignoring`, request);
+        return false;
+    }
+    const { action } = request;
+    const reserved = action.startsWith(LB_RESERVED_PREFIX);
+    // The reserved prefix is the whole of the discriminant, so a reserved
+    // name that is not one of the four operations is a typo rather than
+    // something to forward. Refused here, where the widget can see why: a
+    // server would only report that it declares no such action.
+    if (reserved && !LB_ACTIONS.includes(action)) {
+        console.error(`lb-hub: '${action}' begins with '${LB_RESERVED_PREFIX}' ` +
+            `but names no operation, ignoring`);
+        return false;
+    }
+    const fields = request;
+    // The element's own lb-list or lb-row is what it displays. Where it sits
+    // is its ancestors', the way a control belongs to the form around it.
+    const parent = el.parentElement;
+    const enclosing = parent?.closest(`[${ATTR_LIST}], [${ATTR_ROW}]`);
+    const row = parent?.closest(`[${ATTR_KEY_VALUE}]`);
+    const inScope = {
+        list: enclosing?.getAttribute(ATTR_LIST),
+        row: enclosing?.hasAttribute(ATTR_LIST)
+            ? null
+            : enclosing?.getAttribute(ATTR_ROW),
+        // Only a row of that scope: a key from outside it names a row of some
+        // other list.
+        key: row && enclosing?.contains(row) ? row.getAttribute(ATTR_KEY_VALUE) : null,
+        cell: el.getAttribute(ATTR_CELL),
     };
+    const fill = (name) => {
+        const value = inScope[name];
+        if (fields[name] === undefined && value !== null && value !== undefined) {
+            fields[name] = value;
+        }
+    };
+    const operation = OPERATIONS[action];
+    if (!operation) {
+        // A declared action names one scope or the other, never both.
+        if (fields.list === undefined && fields.row === undefined) {
+            fill("list");
+            fill("row");
+        }
+        fill("key");
+        fill("cell");
+        return true;
+    }
+    for (const name of operation.fills)
+        fill(name);
+    if (fields.values === undefined &&
+        el instanceof HTMLFormElement &&
+        operation.requires.includes("values")) {
+        fields.values = gatherValues(el);
+    }
+    const missing = operation.requires.filter((f) => fields[f] === undefined);
+    if (missing.length > 0) {
+        console.error(`lb-hub: '${action}' from <${el.localName}> has no ` +
+            `${missing.join(", ")} in scope, not sent`, el);
+        return false;
+    }
+    return true;
+}
+/** Dispatch the bare action an element carries, for the hub to scope. */
+function dispatchAction(el) {
+    const detail = { action: el.getAttribute(ATTR_ACTION) };
+    el.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));
 }
 /**
  * The value a cell is currently showing, for gathering rather than landing.
@@ -23,20 +102,19 @@ function binding(el) {
  * A cell is always either a native form control itself (a bare
  * `<input lb-cell>`) or a widget that wraps one (`<lb-input>`, `<lb-select>`)
  * — that wrapping is structural, not incidental, which is what lets this be
- * one rule instead of one per widget type.
+ * one rule instead of one per widget type. The controls are the ones a value
+ * lands on, so what is read back is what landed.
  */
 function controlValue(el) {
-    const control = el instanceof HTMLInputElement ||
-        el instanceof HTMLSelectElement ||
-        el instanceof HTMLTextAreaElement
+    const control = isValueControl(el)
         ? el
-        : el.querySelector("input, select, textarea");
+        : [...el.querySelectorAll("input, select, textarea")].find(isValueControl);
     return control?.value;
 }
 /**
  * Every lb-cell inside a form, gathered into one values map. Shared by
- * lb-insert and lb-update — both submit a batch of cells, and differ only in
- * whether a key comes with them.
+ * lb-row-insert and lb-row-update — both submit a batch of cells, and differ
+ * only in whether a key comes with them.
  */
 function gatherValues(form) {
     const values = {};
@@ -44,7 +122,8 @@ function gatherValues(form) {
         const name = cell.getAttribute(ATTR_CELL);
         const value = controlValue(cell);
         if (value === undefined) {
-            console.warn(`lb-hub: lb-cell '${name}' has no control to read, ignoring it`, cell);
+            console.warn(`lb-hub: lb-cell '${name}' has no input, select or textarea to ` +
+                `read, ignoring it`, cell);
             continue;
         }
         values[name] = value;
@@ -61,6 +140,29 @@ function pageNameFor(path) {
     const name = path.replace(/^\/+|\/+$/g, "");
     return name === "" ? "index" : name;
 }
+/**
+ * The `<template>` a page's markup ships in. The builder guarantees one per
+ * page name (build/locations.ts refuses two page files sharing a stub), so
+ * a second match here means the document was assembled by something else,
+ * and is worth saying out loud rather than resolving by document order.
+ */
+function pageHostFor(page) {
+    const hosts = [];
+    for (const el of document.querySelectorAll(`template[${ATTR_PAGE}]`)) {
+        if (el.getAttribute(ATTR_PAGE) === page) {
+            hosts.push(el);
+        }
+    }
+    if (hosts.length === 0) {
+        console.error(`lb-hub: no page host for '${page}'`);
+        return null;
+    }
+    if (hosts.length > 1) {
+        console.error(`lb-hub: ${hosts.length} page hosts carry ${ATTR_PAGE}="${page}", ` +
+            `using the first`);
+    }
+    return hosts[0];
+}
 /**
  * Fetch one round trip against the client-side deadline. Throws — rather
  * than swallowing — on a non-ok response, a network failure, or a timeout,
@@ -68,11 +170,18 @@ function pageNameFor(path) {
  * only ever wants the freshest data, like navigate()) can tell the two
  * apart from a genuinely empty result.
  */
-async function fetchData(url, init) {
+async function fetchData(page, request) {
+    const url = `${LB_ENDPOINT}?page=${encodeURIComponent(page)}`;
     const controller = new AbortController();
     const timeout = setTimeout(() => controller.abort(), LB_REQUEST_TIMEOUT_MS);
     try {
-        const res = await fetch(url, { ...init, signal: controller.signal });
+        // An empty body is how the hub asks for the page's whole query set.
+        const res = await fetch(url, {
+            method: "POST",
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify(request ?? {}),
+            signal: controller.signal,
+        });
         if (!res.ok) {
             throw new Error(`lb-hub: server responded ${res.status} for ${url}`);
         }
@@ -89,31 +198,31 @@ async function fetchData(url, init) {
 class LbHub extends HTMLElement {
     main;
     /**
-     * The page currently in <main>. Hooks are declared per page, so a request
+     * The page currently in <main>. A page declares its own requests, so a request
      * has to say which page it came from. The page rides on the URL rather
      * than in the request, leaving the operation set closed.
      */
     page = "";
     connectedCallback() {
         this.main = this.querySelector("main");
+        // Scoped in the capture phase, on the way down, so every ancestor that
+        // sees the request on its way back up sees it whole. A request that
+        // cannot be sent is stopped here, before anything sees it at all.
+        this.addEventListener(LB_EVENT_NAME, (e) => {
+            const origin = e.target;
+            const request = e.detail;
+            if (!scope(request, origin))
+                e.stopPropagation();
+        }, { capture: true });
         this.addEventListener(LB_EVENT_NAME, (e) => {
             const request = e.detail;
-            if (!request?.op) {
-                console.warn(`lb-hub: event without an op, ignoring`, request);
-                return;
-            }
             // The element that dispatched the request, not e.currentTarget (the
             // hub itself, since the event bubbles) — pending/error state belongs
             // at the origin so a widget can watch its own attributes.
             const origin = e.target;
             origin?.removeAttribute(ATTR_ERROR);
             origin?.setAttribute(ATTR_PENDING, "");
-            const url = `${LB_REQUEST_ENDPOINT}?page=${encodeURIComponent(this.page)}`;
-            void fetchData(url, {
-                method: "POST",
-                headers: { "content-type": "application/json" },
-                body: JSON.stringify(request),
-            })
+            void fetchData(this.page, request)
                 .then((data) => applyData(this, data))
                 .catch((err) => {
                 console.error(`lb-hub: request failed`, err);
@@ -122,11 +231,11 @@ class LbHub extends HTMLElement {
                 .finally(() => origin?.removeAttribute(ATTR_PENDING));
         });
         /**
-         * A native element carrying an action. The hub builds the request and
-         * dispatches it from that element as the ordinary bubbling event, rather
-         * than sending it directly, so an ancestor widget can still stop it and
-         * confirm. A native action button and a hand-written widget therefore
-         * produce identical events.
+         * A native element carrying an action. The hub dispatches the bare action
+         * from that element as the ordinary bubbling event, rather than sending
+         * it directly, so it is scoped exactly as a widget's is and an ancestor
+         * widget can still stop it and confirm. A native action button and a
+         * hand-written widget therefore produce identical events.
          *
          * A widget carrying an action is left alone — it owns its own interaction
          * and decides what counts as performing it, which for a <select> is a
@@ -137,73 +246,19 @@ class LbHub extends HTMLElement {
             const el = e.target?.closest(`[${ATTR_ACTION}]`);
             if (!el || el.localName.includes("-"))
                 return;
-            e.preventDefault();
-            const detail = {
-                op: "action",
-                name: el.getAttribute(ATTR_ACTION),
-                ...binding(el),
-            };
-            el.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));
-        });
-        // The CRUD counterpart to the lb-action delegation above: a native
-        // element needs no declared name to delete the row it is in, only its
-        // own query/key binding.
-        this.addEventListener("click", (e) => {
-            const el = e.target?.closest(`[${ATTR_DELETE}]`);
-            if (!el || el.localName.includes("-"))
-                return;
-            e.preventDefault();
-            const { query, key } = binding(el);
-            if (!query || !key) {
-                console.warn(`lb-hub: lb-delete with no query/key binding, ignoring`, el);
-                return;
-            }
-            const detail = { op: "tuple-delete", query, key };
-            el.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));
-        });
-        // The CRUD op that gathers rather than binds a single cell: every
-        // lb-cell inside the form becomes one entry of the values map. There is
-        // no key, because there is no row yet — only the query, found the same
-        // way binding() finds one for a click, says what it is inserting
-        // into.
-        this.addEventListener("submit", (e) => {
-            const form = e.target?.closest(`[${ATTR_INSERT}]`);
-            if (!form)
+            // A form performs its action on submit, whatever was clicked in it.
+            if (el instanceof HTMLFormElement)
                 return;
             e.preventDefault();
-            const { query } = binding(form);
-            if (!query) {
-                console.warn(`lb-hub: lb-insert with no lb-query, ignoring`, form);
-                return;
-            }
-            const detail = {
-                op: "tuple-insert",
-                query,
-                values: gatherValues(form),
-            };
-            form.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));
+            dispatchAction(el);
         });
-        // The batch counterpart to cell-change: same gathering as lb-insert, but
-        // with the key of the row it is a form for — a list's row template root,
-        // or a form inside one, has it from the same ancestor a delete button
-        // reads.
+        // The same delegation for the event a form owns.
         this.addEventListener("submit", (e) => {
-            const form = e.target?.closest(`[${ATTR_UPDATE}]`);
-            if (!form)
+            const form = e.target;
+            if (!form || !form.hasAttribute(ATTR_ACTION))
                 return;
             e.preventDefault();
-            const { query, key } = binding(form);
-            if (!query || !key) {
-                console.warn(`lb-hub: lb-update with no query/key binding, ignoring`, form);
-                return;
-            }
-            const detail = {
-                op: "tuple-update",
-                query,
-                key,
-                values: gatherValues(form),
-            };
-            form.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));
+            dispatchAction(form);
         });
         // Only anchors that opted in. Everything else is a real link.
         this.addEventListener("click", (e) => {
@@ -226,9 +281,8 @@ class LbHub extends HTMLElement {
     async navigate(path) {
         const page = pageNameFor(path);
         this.landNavigation(path, page);
-        const template = document.getElementById(PAGE_TEMPLATE_PREFIX + page);
-        if (!(template instanceof HTMLTemplateElement)) {
-            console.error(`lb-hub: no page host for '${page}'`);
+        const template = pageHostFor(page);
+        if (!template) {
             this.reportUnknownPage();
             this.reveal();
             return;
@@ -241,7 +295,7 @@ class LbHub extends HTMLElement {
         this.reveal();
         let data = {};
         try {
-            data = await fetchData(`${LB_DATA_ENDPOINT}?page=${encodeURIComponent(page)}`);
+            data = await fetchData(page);
         }
         catch (err) {
             console.error(`lb-hub: failed to load data for '${page}'`, err);
@@ -258,9 +312,9 @@ class LbHub extends HTMLElement {
         document.body.hidden = false;
     }
     /**
-     * The hub's own query: where the page is, in the vocabulary a server
+     * The hub's own row: where the page is, in the vocabulary a server
      * answer arrives in, so a chrome displays it the way it displays anything
-     * — `lb-query="lb-navigation"` on a subtree, `lb-cell` on what shows a
+     * — `lb-row="lb-navigation"` on a subtree, `lb-cell` on what shows a
      * value. Landed before the page host is looked up, so a miss has it too;
      * the unknown-page dialog is one consumer among whatever others the
      * chrome writes.
@@ -276,7 +330,7 @@ class LbHub extends HTMLElement {
      * be warned about.
      */
     landNavigation(path, page) {
-        if (!this.querySelector(`[${ATTR_QUERY}="${NAV_QUERY}"]`))
+        if (!this.querySelector(`[${ATTR_ROW}="${NAV_ROW}"]`))
             return;
         let label = "";
         for (const a of this.querySelectorAll(`a[${ATTR_NAV_LINK}]`)) {
@@ -286,7 +340,7 @@ class LbHub extends HTMLElement {
             break;
         }
         applyData(this, {
-            [NAV_QUERY]: { [NAV_CELL_LABEL]: label, [NAV_CELL_URI]: path },
+            [NAV_ROW]: { [NAV_CELL_LABEL]: label, [NAV_CELL_URI]: path },
         });
     }
     /**
@@ -299,7 +353,7 @@ class LbHub extends HTMLElement {
      * showModal() without checking the tag here.
      *
      * Only opens it. What the dialog says it gets from landNavigation(),
-     * already run, by naming the hub's query in lb-query like any subtree.
+     * already run, by naming the hub's row in lb-row like any subtree.
      *
      * Scoped to the hub, like every other lookup here, so that one rule holds
      * without exception: what the hub acts on is inside the hub.
@@ -314,3 +368,4 @@ class LbHub extends HTMLElement {
     }
 }
 customElements.define(HUB_TAG_NAME, LbHub);
+//# sourceMappingURL=lb-hub.browser.js.map

package/dist/hub/lb-hub.browser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lb-hub.browser.js","sourceRoot":"","sources":["../../hub/lb-hub.browser.ts"],"names":[],"mappings":"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","sourcesContent":["/// <reference lib=\"dom\" />\n\nimport {\n  ACTION_CELL_CHANGE,\n  ACTION_ROW_DELETE,\n  ACTION_ROW_INSERT,\n  ACTION_ROW_UPDATE,\n  ATTR_ACTION,\n  ATTR_CELL,\n  ATTR_ERROR,\n  ATTR_KEY_VALUE,\n  ATTR_LIST,\n  ATTR_NAV_LINK,\n  ATTR_PAGE,\n  ATTR_PENDING,\n  ATTR_ROW,\n  ATTR_UNKNOWN_PAGE,\n  LB_ACTIONS,\n  LB_RESERVED_PREFIX,\n  HUB_TAG_NAME,\n  NAV_CELL_LABEL,\n  NAV_CELL_URI,\n  NAV_ROW,\n  LB_EVENT_NAME,\n  LB_ENDPOINT,\n  LB_REQUEST_TIMEOUT_MS,\n} from \"../core/lb-constants.js\";\nimport type { HubData, HubRequest } from \"../core/lb-types.js\";\nimport { applyData, isValueControl } from \"./lb-apply.js\";\n\nexport { applyData, applyRow } from \"./lb-apply.js\";\n\n/** What each operation takes from scope, and what it cannot be sent without. */\nconst OPERATIONS: Record<\n  string,\n  { fills: readonly string[]; requires: readonly string[] }\n> = {\n  [ACTION_CELL_CHANGE]: {\n    fills: [\"list\", \"key\", \"cell\"],\n    requires: [\"list\", \"key\", \"cell\", \"value\"],\n  },\n  [ACTION_ROW_INSERT]: { fills: [\"list\"], requires: [\"list\", \"values\"] },\n  [ACTION_ROW_DELETE]: { fills: [\"list\", \"key\"], requires: [\"list\", \"key\"] },\n  [ACTION_ROW_UPDATE]: {\n    fills: [\"list\", \"key\"],\n    requires: [\"list\", \"key\", \"values\"],\n  },\n};\n\n/**\n * Complete a request from where its element sits — see docs/TECHREF-1.0.md,\n * \"Requests\". Every request passes through here, whoever built it, so a\n * widget states what it did and never where it is.\n *\n * The scope field is `list` or `row`, whichever attribute scoped the nearest\n * ancestor, so a declared action fired inside a single-row scope says so and\n * the wire never needs a noun for the addressable thing. A field the request\n * already carries is the dispatcher's to decide and is left as it is.\n *\n * False when the request cannot be sent, having said why.\n */\nfunction scope(request: HubRequest | undefined, el: Element): boolean {\n  if (!request?.action) {\n    console.warn(`lb-hub: event without an action, ignoring`, request);\n    return false;\n  }\n  const { action } = request;\n  const reserved = action.startsWith(LB_RESERVED_PREFIX);\n  // The reserved prefix is the whole of the discriminant, so a reserved\n  // name that is not one of the four operations is a typo rather than\n  // something to forward. Refused here, where the widget can see why: a\n  // server would only report that it declares no such action.\n  if (reserved && !(LB_ACTIONS as readonly string[]).includes(action)) {\n    console.error(\n      `lb-hub: '${action}' begins with '${LB_RESERVED_PREFIX}' ` +\n        `but names no operation, ignoring`,\n    );\n    return false;\n  }\n\n  const fields = request as unknown as Record<string, unknown>;\n  // The element's own lb-list or lb-row is what it displays. Where it sits\n  // is its ancestors', the way a control belongs to the form around it.\n  const parent = el.parentElement;\n  const enclosing = parent?.closest(`[${ATTR_LIST}], [${ATTR_ROW}]`);\n  const row = parent?.closest(`[${ATTR_KEY_VALUE}]`);\n  const inScope: Record<string, string | null | undefined> = {\n    list: enclosing?.getAttribute(ATTR_LIST),\n    row: enclosing?.hasAttribute(ATTR_LIST)\n      ? null\n      : enclosing?.getAttribute(ATTR_ROW),\n    // Only a row of that scope: a key from outside it names a row of some\n    // other list.\n    key:\n      row && enclosing?.contains(row) ? row.getAttribute(ATTR_KEY_VALUE) : null,\n    cell: el.getAttribute(ATTR_CELL),\n  };\n  const fill = (name: string) => {\n    const value = inScope[name];\n    if (fields[name] === undefined && value !== null && value !== undefined) {\n      fields[name] = value;\n    }\n  };\n\n  const operation = OPERATIONS[action];\n  if (!operation) {\n    // A declared action names one scope or the other, never both.\n    if (fields.list === undefined && fields.row === undefined) {\n      fill(\"list\");\n      fill(\"row\");\n    }\n    fill(\"key\");\n    fill(\"cell\");\n    return true;\n  }\n\n  for (const name of operation.fills) fill(name);\n  if (\n    fields.values === undefined &&\n    el instanceof HTMLFormElement &&\n    operation.requires.includes(\"values\")\n  ) {\n    fields.values = gatherValues(el);\n  }\n  const missing = operation.requires.filter((f) => fields[f] === undefined);\n  if (missing.length > 0) {\n    console.error(\n      `lb-hub: '${action}' from <${el.localName}> has no ` +\n        `${missing.join(\", \")} in scope, not sent`,\n      el,\n    );\n    return false;\n  }\n  return true;\n}\n\n/** Dispatch the bare action an element carries, for the hub to scope. */\nfunction dispatchAction(el: Element): void {\n  const detail = { action: el.getAttribute(ATTR_ACTION)! } as HubRequest;\n  el.dispatchEvent(new CustomEvent(LB_EVENT_NAME, { bubbles: true, detail }));\n}\n\n/**\n * The value a cell is currently showing, for gathering rather than landing.\n *\n * A cell is always either a native form control itself (a bare\n * `<input lb-cell>`) or a widget that wraps one (`<lb-input>`, `<lb-select>`)\n * — that wrapping is structural, not incidental, which is what lets this be\n * one rule instead of one per widget type. The controls are the ones a value\n * lands on, so what is read back is what landed.\n */\nfunction controlValue(el: Element): string | undefined {\n  const control = isValueControl(el)\n    ? el\n    : [...el.querySelectorAll(\"input, select, textarea\")].find(isValueControl);\n  return control?.value;\n}\n\n/**\n * Every lb-cell inside a form, gathered into one values map. Shared by\n * lb-row-insert and lb-row-update — both submit a batch of cells, and differ\n * only in whether a key comes with them.\n */\nfunction gatherValues(form: Element): Record<string, string> {\n  const values: Record<string, string> = {};\n  for (const cell of form.querySelectorAll(`[${ATTR_CELL}]`)) {\n    const name = cell.getAttribute(ATTR_CELL)!;\n    const value = controlValue(cell);\n    if (value === undefined) {\n      console.warn(\n        `lb-hub: lb-cell '${name}' has no input, select or textarea to ` +\n          `read, ignoring it`,\n        cell,\n      );\n      continue;\n    }\n    values[name] = value;\n  }\n  return values;\n}\n\n/**\n * A path names a page host, and nothing finer. The bare path resolves to\n * `index`, the same convention a static file server follows — an\n * application names its landing page that way rather than the hub singling\n * one out.\n */\nfunction pageNameFor(path: string): string {\n  const name = path.replace(/^\\/+|\\/+$/g, \"\");\n  return name === \"\" ? \"index\" : name;\n}\n\n/**\n * The `<template>` a page's markup ships in. The builder guarantees one per\n * page name (build/locations.ts refuses two page files sharing a stub), so\n * a second match here means the document was assembled by something else,\n * and is worth saying out loud rather than resolving by document order.\n */\nfunction pageHostFor(page: string): HTMLTemplateElement | null {\n  const hosts: HTMLTemplateElement[] = [];\n  for (const el of document.querySelectorAll(`template[${ATTR_PAGE}]`)) {\n    if (el.getAttribute(ATTR_PAGE) === page) {\n      hosts.push(el as HTMLTemplateElement);\n    }\n  }\n  if (hosts.length === 0) {\n    console.error(`lb-hub: no page host for '${page}'`);\n    return null;\n  }\n  if (hosts.length > 1) {\n    console.error(\n      `lb-hub: ${hosts.length} page hosts carry ${ATTR_PAGE}=\"${page}\", ` +\n        `using the first`,\n    );\n  }\n  return hosts[0]!;\n}\n\n/**\n * Fetch one round trip against the client-side deadline. Throws — rather\n * than swallowing — on a non-ok response, a network failure, or a timeout,\n * so a caller that needs to know the request failed (as opposed to one that\n * only ever wants the freshest data, like navigate()) can tell the two\n * apart from a genuinely empty result.\n */\nasync function fetchData(page: string, request?: HubRequest): Promise<HubData> {\n  const url = `${LB_ENDPOINT}?page=${encodeURIComponent(page)}`;\n  const controller = new AbortController();\n  const timeout = setTimeout(() => controller.abort(), LB_REQUEST_TIMEOUT_MS);\n  try {\n    // An empty body is how the hub asks for the page's whole query set.\n    const res = await fetch(url, {\n      method: \"POST\",\n      headers: { \"content-type\": \"application/json\" },\n      body: JSON.stringify(request ?? {}),\n      signal: controller.signal,\n    });\n    if (!res.ok) {\n      throw new Error(`lb-hub: server responded ${res.status} for ${url}`);\n    }\n    return (await res.json()) as HubData;\n  } finally {\n    clearTimeout(timeout);\n  }\n}\n\n/**\n * The hub is a singleton outside <main>. It survives every page change,\n * so it needs no id to disambiguate it.\n */\nclass LbHub extends HTMLElement {\n  private main!: HTMLElement;\n\n  /**\n   * The page currently in <main>. A page declares its own requests, so a request\n   * has to say which page it came from. The page rides on the URL rather\n   * than in the request, leaving the operation set closed.\n   */\n  private page = \"\";\n\n  connectedCallback() {\n    this.main = this.querySelector(\"main\")!;\n\n    // Scoped in the capture phase, on the way down, so every ancestor that\n    // sees the request on its way back up sees it whole. A request that\n    // cannot be sent is stopped here, before anything sees it at all.\n    this.addEventListener(\n      LB_EVENT_NAME,\n      (e: Event) => {\n        const origin = e.target as Element;\n        const request = (e as CustomEvent<HubRequest>).detail;\n        if (!scope(request, origin)) e.stopPropagation();\n      },\n      { capture: true },\n    );\n\n    this.addEventListener(LB_EVENT_NAME, (e: Event) => {\n      const request = (e as CustomEvent<HubRequest>).detail;\n      // The element that dispatched the request, not e.currentTarget (the\n      // hub itself, since the event bubbles) — pending/error state belongs\n      // at the origin so a widget can watch its own attributes.\n      const origin = e.target as Element | null;\n      origin?.removeAttribute(ATTR_ERROR);\n      origin?.setAttribute(ATTR_PENDING, \"\");\n      void fetchData(this.page, request)\n        .then((data) => applyData(this, data))\n        .catch((err) => {\n          console.error(`lb-hub: request failed`, err);\n          origin?.setAttribute(ATTR_ERROR, \"\");\n        })\n        .finally(() => origin?.removeAttribute(ATTR_PENDING));\n    });\n\n    /**\n     * A native element carrying an action. The hub dispatches the bare action\n     * from that element as the ordinary bubbling event, rather than sending\n     * it directly, so it is scoped exactly as a widget's is and an ancestor\n     * widget can still stop it and confirm. A native action button and a\n     * hand-written widget therefore produce identical events.\n     *\n     * A widget carrying an action is left alone — it owns its own interaction\n     * and decides what counts as performing it, which for a <select> is a\n     * change rather than a click. The test is the same lexical one applyData\n     * uses: a hyphen in the tag name.\n     */\n    this.addEventListener(\"click\", (e: MouseEvent) => {\n      const el = (e.target as Element | null)?.closest(`[${ATTR_ACTION}]`);\n      if (!el || el.localName.includes(\"-\")) return;\n      // A form performs its action on submit, whatever was clicked in it.\n      if (el instanceof HTMLFormElement) return;\n      e.preventDefault();\n      dispatchAction(el);\n    });\n\n    // The same delegation for the event a form owns.\n    this.addEventListener(\"submit\", (e: SubmitEvent) => {\n      const form = e.target as Element | null;\n      if (!form || !form.hasAttribute(ATTR_ACTION)) return;\n      e.preventDefault();\n      dispatchAction(form);\n    });\n\n    // Only anchors that opted in. Everything else is a real link.\n    this.addEventListener(\"click\", (e: MouseEvent) => {\n      const link = (e.target as Element | null)?.closest(`a[${ATTR_NAV_LINK}]`);\n      if (!link) return;\n      e.preventDefault();\n      const path = new URL((link as HTMLAnchorElement).href).pathname;\n      history.pushState(null, \"\", path);\n      void this.navigate(path);\n    });\n\n    addEventListener(\"popstate\", () => void this.navigate(location.pathname));\n\n    void this.navigate(location.pathname);\n  }\n\n  /**\n   * Navigation is the one operation that replaces host DOM. The host is\n   * already in the document, so selecting a page is getElementById() and\n   * there is no fetching mechanism on the host channel.\n   */\n  private async navigate(path: string): Promise<void> {\n    const page = pageNameFor(path);\n    this.landNavigation(path, page);\n    const template = pageHostFor(page);\n    if (!template) {\n      this.reportUnknownPage();\n      this.reveal();\n      return;\n    }\n    this.page = page;\n    // Insert the page shell before fetching its data, not after: the\n    // template is already in the document, so holding it back behind a\n    // network round trip only leaves <main> empty for no reason.\n    this.main.replaceChildren(template.content.cloneNode(true));\n    this.reveal();\n    let data: HubData = {};\n    try {\n      data = await fetchData(page);\n    } catch (err) {\n      console.error(`lb-hub: failed to load data for '${page}'`, err);\n    }\n    applyData(this, data);\n  }\n\n  /**\n   * An app that ships `<body hidden>` (see docs/reference/chrome.md) is\n   * asking to stay invisible until there is something coherent to show,\n   * rather than flash the chrome before `<main>` has real content. This is\n   * a no-op for an app that doesn't use that convention.\n   */\n  private reveal(): void {\n    document.body.hidden = false;\n  }\n\n  /**\n   * The hub's own row: where the page is, in the vocabulary a server\n   * answer arrives in, so a chrome displays it the way it displays anything\n   * — `lb-row=\"lb-navigation\"` on a subtree, `lb-cell` on what shows a\n   * value. Landed before the page host is looked up, so a miss has it too;\n   * the unknown-page dialog is one consumer among whatever others the\n   * chrome writes.\n   *\n   * The label is the nav's: the text of the first lb-nav-link anchor whose\n   * href names this page. Taken from the nav rather than from a click, so a\n   * click, a reload and the back button all land the same label — and a\n   * path no anchor names lands an empty one, explicitly, so a consumer is\n   * never left showing the previous page's.\n   *\n   * Landed only where a subtree names it. applyData() warns about a query\n   * with no scope, and a chrome that displays no navigation has nothing to\n   * be warned about.\n   */\n  private landNavigation(path: string, page: string): void {\n    if (!this.querySelector(`[${ATTR_ROW}=\"${NAV_ROW}\"]`)) return;\n    let label = \"\";\n    for (const a of this.querySelectorAll<HTMLAnchorElement>(\n      `a[${ATTR_NAV_LINK}]`,\n    )) {\n      if (pageNameFor(new URL(a.href).pathname) !== page) continue;\n      label = a.textContent?.trim() ?? \"\";\n      break;\n    }\n    applyData(this, {\n      [NAV_ROW]: { [NAV_CELL_LABEL]: label, [NAV_CELL_URI]: path },\n    });\n  }\n\n  /**\n   * A path that resolves to no page host is discovered client-side, after a\n   * successful 200 — every route gets the same document, so there is no\n   * HTTP 404 to report (see docs/tutorials/010-pages-and-navigation.md).\n   * lb-unknown-page is optional: an application that declares none gets\n   * nothing beyond navigate()'s console.error. The builder guarantees the\n   * element it's on is a <dialog> (build/assemble.ts), so this can call\n   * showModal() without checking the tag here.\n   *\n   * Only opens it. What the dialog says it gets from landNavigation(),\n   * already run, by naming the hub's row in lb-row like any subtree.\n   *\n   * Scoped to the hub, like every other lookup here, so that one rule holds\n   * without exception: what the hub acts on is inside the hub.\n   */\n  private reportUnknownPage(): void {\n    const dialog = this.querySelector(`[${ATTR_UNKNOWN_PAGE}]`);\n    if (!dialog) return;\n    const modal = dialog as HTMLDialogElement;\n    if (!modal.open) modal.showModal();\n  }\n}\n\ncustomElements.define(HUB_TAG_NAME, LbHub);\n"]}

package/dist/server/lb-express.d.ts

@@ -6,16 +6,19 @@
  * Express itself is a peer dependency: nothing outside this file imports it,
  * so an application that hosts Hub some other way never pays for it.
  *
- * Two endpoints, and no third:
+ * One endpoint, and no second:
  *
- *   GET  /hub/data?page=<name>   the page's whole query set
- *   POST /hub?page=<name>        one operation, then its refresh set
+ *   POST /lb?page=<name>   an empty body asks for the page's whole query
+ *                          set; a body carrying an action runs that action
+ *                          and answers with its refresh set
  *
  * The page rides on the query string rather than in the body, which is what
- * lets the operation set stay closed.
+ * lets the operation set stay closed. Every hub call is a POST, so an
+ * application's own GET routes never collide with this one and no page name
+ * is reserved.
  */
 import { type Request, type Router } from "express";
-import type { Hub, HubContext } from "./lb-server";
+import type { Hub, HubContext } from "./lb-server.js";
 /**
  * Building the context is the application's job — it is where an
  * authenticated database handle comes from — so it is injected rather than

package/dist/server/lb-express.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lb-express.d.ts","sourceRoot":"","sources":["../../server/lb-express.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAgB,EAAE,KAAK,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,SAAS,CAAC;AAG7D,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEnD;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK,UAAU,CAAC;AAEtD,wBAAgB,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,GAAG,MAAM,CAkElE"}
+{"version":3,"file":"lb-express.d.ts","sourceRoot":"","sources":["../../server/lb-express.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAgB,EAAE,KAAK,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,SAAS,CAAC;AAS7D,OAAO,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEtD;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK,UAAU,CAAC;AAEtD,wBAAgB,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,GAAG,MAAM,CAkFlE"}

package/dist/server/lb-express.js

@@ -6,72 +6,85 @@
  * Express itself is a peer dependency: nothing outside this file imports it,
  * so an application that hosts Hub some other way never pays for it.
  *
- * Two endpoints, and no third:
+ * One endpoint, and no second:
  *
- *   GET  /hub/data?page=<name>   the page's whole query set
- *   POST /hub?page=<name>        one operation, then its refresh set
+ *   POST /lb?page=<name>   an empty body asks for the page's whole query
+ *                          set; a body carrying an action runs that action
+ *                          and answers with its refresh set
  *
  * The page rides on the query string rather than in the body, which is what
- * lets the operation set stay closed.
+ * lets the operation set stay closed. Every hub call is a POST, so an
+ * application's own GET routes never collide with this one and no page name
+ * is reserved.
  */
 import express from "express";
-import { LB_DATA_ENDPOINT, LB_REQUEST_ENDPOINT } from "../core/lb-constants.js";
+import { ACTION_CELL_CHANGE, ACTION_ROW_DELETE, ACTION_ROW_INSERT, ACTION_ROW_UPDATE, LB_ENDPOINT, } from "../core/lb-constants.js";
+import { isOperation } from "../core/lb-types.js";
 export function hubRoutes(hub, contextFor) {
     const router = express.Router();
     // Mounted here rather than on the app so that Hub's need for a parsed
     // body is stated where the routes that need it are.
     router.use(express.json());
-    router.get(LB_DATA_ENDPOINT, async (req, res) => {
+    router.post(LB_ENDPOINT, async (req, res) => {
         const page = String(req.query.page ?? "");
-        res.json(await hub.dataForPage(page, contextFor(req)));
-    });
-    router.post(LB_REQUEST_ENDPOINT, async (req, res) => {
-        const page = String(req.query.page ?? "");
-        // The body is unknown until op says which shape it is, so it is read
-        // once through this loose view for the case that does not match one.
-        const body = req.body;
         const request = req.body;
         const ctx = contextFor(req);
+        // No body at all is the page load: the browser is asking for this
+        // page's whole query set, which is every request it makes that names no
+        // action. A body that carries something but not an action is malformed.
+        if (request === undefined || Object.keys(request).length === 0) {
+            res.json(await hub.dataForPage(page, ctx));
+            return;
+        }
+        if (!request.action) {
+            console.warn(`loadbare: request without an action`);
+            res.status(400).json({});
+            return;
+        }
         // A thrown error is how application code (a query, an action, a CRUD
         // op) says "this request is invalid" or hits an unexpected failure —
         // it resolves to a real response rather than an unhandled rejection, so
         // the browser side has something to catch.
         try {
-            switch (request?.op) {
-                case "action": {
-                    const { name, query, key, cell, value } = request;
-                    res.json(await hub.runAction(page, name, { query, key, cell, value }, ctx));
-                    return;
-                }
-                case "cell-change": {
-                    const { query, key, cell, value } = request;
-                    res.json(await hub.runCellChange(page, { query, key, cell, value }, ctx));
+            // The reserved prefix is the whole of the discriminant: a name so
+            // prefixed is one of the four operations, and anything else is a name
+            // the page declared. Nothing else tells them apart, here or anywhere.
+            if (!isOperation(request)) {
+                const { action, list, row, key, cell, value } = request;
+                res.json(await hub.runAction(page, action, { list, row, key, cell, value }, ctx));
+                return;
+            }
+            switch (request.action) {
+                case ACTION_CELL_CHANGE: {
+                    const { list, key, cell, value } = request;
+                    res.json(await hub.runCellChange(page, { list, key, cell, value }, ctx));
                     return;
                 }
-                case "tuple-delete": {
-                    const { query, key } = request;
-                    res.json(await hub.runTupleDelete(page, { query, key }, ctx));
+                case ACTION_ROW_DELETE: {
+                    const { list, key } = request;
+                    res.json(await hub.runRowDelete(page, { list, key }, ctx));
                     return;
                 }
-                case "tuple-insert": {
-                    const { query, values } = request;
-                    res.json(await hub.runTupleInsert(page, { query, values }, ctx));
+                case ACTION_ROW_INSERT: {
+                    const { list, values } = request;
+                    res.json(await hub.runRowInsert(page, { list, values }, ctx));
                     return;
                 }
-                case "tuple-update": {
-                    const { query, key, values } = request;
-                    res.json(await hub.runTupleUpdate(page, { query, key, values }, ctx));
+                case ACTION_ROW_UPDATE: {
+                    const { list, key, values } = request;
+                    res.json(await hub.runRowUpdate(page, { list, key, values }, ctx));
                     return;
                 }
                 default:
-                    console.warn(`loadbare: operation '${body?.op}' not implemented`);
+                    console.warn(`loadbare: operation '${request.action}' not implemented`);
                     res.status(400).json({});
             }
         }
         catch (err) {
-            console.error(`loadbare: operation '${request?.op}' threw`, err);
+            console.error(`loadbare: '${request.action}' threw`, err);
             res.status(500).json({});
         }
     });
     return router;
 }
+//# sourceMappingURL=lb-express.js.map