@loadbare/app 0.24.0 → 0.26.0

package/docs/reference/server.md

@@ -199,7 +199,6 @@ interface HubRequest {
   name: string;
   query?: string;
   key?: string;
-  keys?: string[];
   values?: Record<string, string>;
   rows?: Record<string, { key: string; values: Record<string, string> }[]>;
 }

package/docs/testing.md

@@ -210,12 +210,11 @@ evidence here.
   is not counted
 - the order and the filter place all rows and a patch alike, except where
   the list's `lb-manual` leaves a side to the user, which keeps its rows
-  standing and stamped until they are placed again; groups come and go with
-  their rows to any depth, aggregates follow every landing, and every change
+  standing and stamped until they are placed again, and every change
   leaves a stamp a stylesheet can see (`lb-order.test.ts`)
 - a filter's text reads and passes values as documented, and a choice of
   order or filter places the rows already landed again, hiding rows and
-  groups and leaving them out of counts and aggregates (`lb-choices.test.ts`)
+  leaving them out of counts (`lb-choices.test.ts`)
 - `lb-show` moves an element into a template and back, and landing reaches
   inside it
 - a row whose values arrive as it already shows them is not filled again,
@@ -296,8 +295,6 @@ What the hub is tested for here:
   queries land
 - a form pointed at a row by `commandfor` fills from the row the hub holds,
   and a row not yet entered sends no update or delete
-- ticked `lb-select` rows travel as `keys`, and the selection clears once
-  the request succeeds
 - a refusal lands its message on the element that committed and on each
   control it names
 - `lb-request-done` reaches the element that committed and its ancestors

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@loadbare/app",
   "description": "High performance web app framework for server-bound applications",
-  "version": "0.24.0",
+  "version": "0.26.0",
   "type": "module",
   "files": [
     "dist",

package/skills/loadbare-app/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: loadbare-app
-description: Build server-bound web applications with Loadbare/app. Covers the file conventions the builder finds by name (`chrome.html`, `*.page.html`, `*.queries.ts`, `*.requests.ts`, `imports.ts`, `<tag>.html`, `<tag>.browser.ts`); the `lb-*` attribute vocabulary that lands query rows on HTML and issues requests (`lb-query`, `lb-column`, `lb-show`, `lb-request`); queries declared with `row(key, run)` and `rows(key, run)`; the URL as the hub's own query `lb-url`, with `lb-url-link`, `lb-url-parm`, `lb-url-push` and `lb-url-unknown`; the user's order and filters as the hub's query `lb-choices`, read by `lb-order` and `lb-filter`; whether the page loaded and the server answers as the hub's query `lb-hub`; one form pointed at a row by the `--lb-edit`, `--lb-new` and `--lb-release` commands; rows that hold still under `lb-manual` and are placed again with `--lb-place`; build-time expansion with `exp-*` parameters, `lb-exp-slot` and `lb-exp-template`; custom elements as form-associated controls and row hosts; the Express wiring with `hubRoutes`; and the `@loadbare/widgets` library. Use whenever a task involves `@loadbare/app`, `@loadbare/widgets`, `loadbare-app-build`, an `lb-` attribute, or a page, query, request or custom element file in a Loadbare application. The model is not React, htmx or REST, and cannot be inferred from them.
+description: Build server-bound web applications with Loadbare/app. Covers the file conventions the builder finds by name (`chrome.html`, `*.page.html`, `*.queries.ts`, `*.requests.ts`, `imports.ts`, `<tag>.html`, `<tag>.browser.ts`); the `lb-*` attribute vocabulary that lands query rows on HTML and issues requests (`lb-query`, `lb-column`, `lb-show`, `lb-request`); queries declared with `row(key, run)` and `rows(key, run)`; the URL as the hub's own query `lb-url`, with `lb-url-link`, `lb-url-parm`, `lb-url-push` and `lb-url-unknown`; the user's order and filters as the hub's queries `lb-sort` and `lb-filters`, read by `lb-filter`; whether the page loaded and the server answers as the hub's query `lb-hub-status`; one form pointed at a row by the `--lb-edit`, `--lb-new` and `--lb-release` commands; rows that hold still under `lb-manual` and are placed again with `--lb-place`; build-time expansion with `exp-*` parameters, `lb-exp-slot` and `lb-exp-template`; custom elements as form-associated controls and row hosts; the Express wiring with `hubRoutes`; and the `@loadbare/widgets` library. Use whenever a task involves `@loadbare/app`, `@loadbare/widgets`, `loadbare-app-build`, an `lb-` attribute, or a page, query, request or custom element file in a Loadbare application. The model is not React, htmx or REST, and cannot be inferred from them.
 license: Apache-2.0
 metadata:
   package: "@loadbare/app"
@@ -75,7 +75,7 @@ server.ts
 The chrome carries `<lb-hub>` inside `<body>`, an empty `<main>` inside the
 hub, and `<script src="/client.js" defer>`.  Everything a user touches sits
 inside `<lb-hub>`.  The chrome belongs to no page, so it names only the
-hub's queries, `lb-url`, `lb-choices` and `lb-hub`, and sends no declared
+hub's queries, `lb-url`, `lb-sort`, `lb-filters` and `lb-hub-status`, and sends no declared
 request.
 
 A page is an HTML fragment that lands in `<main>`:
@@ -183,13 +183,23 @@ from it.
 
 **A column never holds rows.**  Master-detail is a `row` query and a `rows`
 query under two names.  Many masters with their details is one `rows` query
-of joined rows, ordered by the master first and shown in groups.  A
+of joined rows, ordered by the master first.  A
 query nested inside another query's row template receives the same rows in
 every outer row; use it for a picker, never for per-row detail.  Inside a
 form, the live rows of a query nested in the form's own are gathered as
 `rows: { <query>: [{ key, values }] }` beside `values`, so a master and a
 subtable of its details (one input per type, say) are entered in one
-submit, and the master's handler writes both.  A new outer
+submit, and the master's handler writes both.  A detail not yet entered
+is added by a button with `commandfor` naming the nested list and
+`command="--lb-new"`: it adds a row with the empty key and sends nothing,
+the form's submit carries it as `{ key: "", values }`, the handler inserts
+each row with no key, and it leaves when the submit succeeds.  So a master
+and its details are one save, before or after the master is on record; never
+gate the details behind `lb-show` on the master being saved.  A form bound
+by Edit or New reads its nested lists again (`lb-read`) with the bound key
+as the parm named for its key column, so the details query reads that parm
+and follows the row the form is bound to; New sends it empty.  The form needs
+a submit.  A new outer
 row is filled from the nested query's last answer, whatever order they land
 in.
 
@@ -213,21 +223,19 @@ JSON number or is declared one: `types: { amount: "number" }` beside
 hold a place.
 
 **The user's order and filters are choices, not query parms.**  The hub
-serves a second query, `lb-choices`, keyed by `lb-path`, one column per
-choice, named by the application.  A control inside
-`lb-query="lb-choices"` with `lb-request="lb-row-update"` makes a choice.
-`lb-order="<choice>"` on the element carrying `lb-query` places its rows by
-the order that choice holds, in place of the server's while it is not
-empty.  `lb-filter="col, col"` there hides each row that does not pass the
-choice of the same name: `^=Amazon`, `>=2026-01-01 <=2026-03-31`, or plain
-text for contains.  A choice shows with no round trip, then the server's
-`onChoices(ctx, choices)` hears every choice, to keep them;
-`onPageEnter` returns `choices()` to restore them.  Choices hold until the
-page changes.  A filter that decides which rows the server sends is a query
-parm.
+serves them as two queries, `lb-sort` and `lb-filters`, one row per query
+keyed by the query's name.  `lb-sort` holds each query's order as the
+server resolved it; `lb-filters` holds each query's filter values.
+`lb-filter="col, col"` on the element carrying `lb-query` hides each row
+that does not pass its query's filter of the same name: `^=Amazon`,
+`>=2026-01-01 <=2026-03-31`, or plain text for contains.  The server's
+`onChoices(ctx, { query, sort, filters })` hears each change, to keep it;
+`onPageEnter` returns `sort()` and `filters()` to restore them.  Choices
+hold until the page changes.  A filter that decides which rows the server
+sends is a query parm.
 
 **A page that failed to load says so.**  The hub serves a third query,
-`lb-hub`, and stamps its columns on `<lb-hub>` too: `lb-load-state`
+`lb-hub-status`, and stamps its columns on `<lb-hub>` too: `lb-load-state`
 (`loading`, `loaded`, `failed`), `lb-server-state` (`reachable`, `failing`,
 `unreachable`), `lb-error` (`network`, `timeout` or the HTTP status),
 `lb-pending` and `lb-as-of`.  Show a server that is down from the chrome's
@@ -235,19 +243,10 @@ stylesheet, `lb-hub[lb-load-state="failed"] .load-failed`, rather than
 leaving an empty page; see
 [`references/chrome.md`](references/chrome.md#the-hubs-state).
 
-**Groups are templates.**  A `<template lb-group>` holds a heading and one
-nested `<template>`, the next level or the row template; the nth breaks on
-the order's nth term, to any depth.  Contents land before the nested
-template, so put it inside the heading's element for a container and beside
-the heading for a heading row.  `<tbody>` and `<optgroup>` do not nest.  The
-heading is filled from the group's first row.  `lb-count`, `lb-sum="col"`,
-`lb-avg`, `lb-min` and `lb-max` total the rows showing in the nearest group,
-or in the whole list outside any.
-
 **Animate with CSS.**  The hub stamps `lb-row-created`, `lb-row-changed`,
 `lb-row-moved` (its values changed and it now stands elsewhere), and
 `lb-row-requested` for this page's request, and marks a
-leaving row or group `lb-row-leaving` or `lb-group-leaving`, removing it once
+leaving row `lb-row-leaving`, removing it once
 its animations end.  Scrolling to a row is script, in `lbRowsLanded`.
 
 **Every request has one shape.**  `lb-request` names the request, and the
@@ -296,7 +295,11 @@ not a form.)  The form's `lb-key-value` is the row's key, empty
 for a new row, absent when not in use, and a stylesheet shows Save or Save
 new by it.  A successful request from the form, or its dialog closing, lets
 it go.  Which row is being edited is never a query parm.  A row that must be
-fetched to be edited is another page, with that row as its master.
+fetched to be edited is another page, with that row as its master.  A
+pointed form edits only what its row holds: a query nested in it shows the
+page's answer, not the pointed row's details, so give the row a column per
+detail when the details are a fixed set, or make the row the page's master
+by a parm.
 
 **Three requests are Loadbare's.**  `lb-row-insert` needs `query` and
 `values`, `lb-row-update` needs `query`, `key` and `values`, and
@@ -309,22 +312,13 @@ request the page does not declare.  One that arrives anyway, from a script,
 is warned about on the server console and answered with nothing.
 
 **An empty key is a row not yet entered.**  A `row` query answering with an
-empty key, or a form `--lb-new` pointed, carries `lb-key-value=""`.  The hub
+empty key, a form `--lb-new` pointed, or a row `--lb-new` added to a list,
+carries `lb-key-value=""`.  The hub
 sends inserts and declared requests from it with no `key`, and sends no
 update or delete at all, silently.  So a control with
 `lb-request="lb-row-update"` saves on a row on record and only holds its
 value on a new one.  Never write script to stop such an update.
 
-**Select rows with `lb-select`, never with a column.**  An
-`<input type="checkbox" lb-select>` in a row template selects its row; the
-hub stamps `lb-row-selected`.  A request for that query naming no one row,
-such as a form outside the rows, carries the ticked rows as `keys`.
-`rowUpdate` and `rowDelete` then run once per key with no new code; a
-declared request gets `keys` itself.  With none ticked an update or delete
-is not sent.  Success clears the selection, and so does `lb-show` hiding a
-selector.  A selecting mode kept in the URL reaches the rows as a column the
-query computes from the parm.
-
 **Refuse with `refusal()`, never with a plain throw.**  `throw
 refusal("message")`, `throw refusal({ column: "message" })` or both, from
 `@loadbare/app/server`.  The whole-request message lands as the
@@ -427,9 +421,9 @@ whole data channel.
 
 **The developer writes `lb-*` attributes in markup, and script never
 assigns them.**  The builder refuses any `lb-` attribute other than the
-eighteen in [Attributes](references/names.md#attributes): `lb-query`,
-`lb-column`, `lb-show`, `lb-order`, `lb-filter`, `lb-manual`, `lb-group`, `lb-count`,
-`lb-sum`, `lb-avg`, `lb-min`, `lb-max`, `lb-select`, `lb-request`,
+ten in [Attributes](references/names.md#attributes): `lb-query`,
+`lb-column`, `lb-show`, `lb-filter`, `lb-manual`,
+`lb-request`,
 `lb-url-link`, `lb-url-parm`, `lb-url-push` and `lb-url-unknown`.  `lb-exp-slot` and
 `lb-exp-template` are expansion's, and never reach the page.  Everything
 else with the prefix is a stamp the hub or the builder writes.
@@ -515,28 +509,44 @@ The application's own definition of a tag overrides a package's.
 Read these when the summary above does not settle the question.  They ship
 with the package, so no network is needed.
 
-- [`references/overview.md`](references/overview.md) — the map of the
-  reference, by part of the application.
+[`references/overview.md`](references/overview.md) is the map of the
+reference, in the groups below.
+
+The application shell:
+
+- [`references/chrome.md`](references/chrome.md) — the chrome, the URL as
+  the query `lb-url`, and the hub's state.
+- [`references/server.md`](references/server.md) — the Express server, the
+  request context, and where the database layer fits.
+
+Building the app:
+
+- [`references/builder.md`](references/builder.md) — the builder's options,
+  what it reads, where it looks, and what it writes.
+- [`references/css.md`](references/css.md) — how stylesheets are ordered, and
+  the stamps a stylesheet selects on.
+- [`references/dev-server.md`](references/dev-server.md) — `devServer` from
+  `@loadbare/app/dev`, and the parts to assemble another from.
+
+Application pages:
+
+- [`references/page-files.md`](references/page-files.md) — what page
+  files are, queries, `onPageEnter`, `onChoices`, handlers, `crud`, refresh
+  and patch, `url()`, `sort()` and `filters()`.
 - [`references/data-binding.md`](references/data-binding.md) — landing,
   gathering, requests, conditions and request state.  Start here for
   anything in a page.
-- [`references/page-files.md`](references/page-files.md) — what page
-  files are, queries, `onPageEnter`, `onChoices`, handlers, `crud`, refresh
-  and patch, `url()` and `choices()`.
+
+Custom elements:
+
 - [`references/custom-elements.md`](references/custom-elements.md) —
   expansion, parameters, slots, destinations, and custom element code and
   when it runs.
-- [`references/chrome.md`](references/chrome.md) — the chrome, and the URL
-  as the query `lb-url`.
-- [`references/server.md`](references/server.md) — the Express server and
-  the request context.
-- [`references/builder.md`](references/builder.md) — the builder's options,
-  what it reads, and where it looks.
-- [`references/dev-server.md`](references/dev-server.md) — `devServer` from
-  `@loadbare/app/dev`, and the parts to assemble another from.
-- [`references/css.md`](references/css.md) — how stylesheets are ordered.
 - [`references/widgets.md`](references/widgets.md) — the basic widget
   library as a package; each widget is in the loadbare-widgets skill.
+
+Names:
+
 - [`references/names.md`](references/names.md) — every name Loadbare
   owns, the constants, and the section defining each.  Check a name here
   before designing around something the other references do not mention.

package/skills/loadbare-app/references/css.md

@@ -69,7 +69,6 @@ in the stamp, so the selector reads the number and not its text.  See
 | Select               | For                                             |
 |----------------------|-------------------------------------------------|
 | `[lb-row-live]`      | Every live row of a list                        |
-| `[lb-row-selected]`  | A row its `lb-select` checkbox ticks            |
 | `[lb-row-editing]`   | The row a pointed form is editing               |
 | `[lb-key-value="…"]` | One row, by its key                             |
 | `[hidden]`           | A row a filter hides; the browser hides it      |
@@ -86,24 +85,12 @@ landed inside a list, such as a total in a table's foot, carries a key and
 is not one of the list's rows.
 
 ```css
-[lb-row-selected] { background: var(--selected); }
 [lb-row-editing] { outline: 2px solid var(--accent); }
 ```
 
-See [Rows](./data-binding.md#rows), [Selecting rows](./data-binding.md#selecting-rows)
+See [Rows](./data-binding.md#rows)
 and [Editing a row in one form](./data-binding.md#editing-a-row-in-one-form).
 
-### A group
-
-Each top-level element of a group carries `lb-group-live`, the column it
-breaks on as `lb-group-column`, and its value there as `lb-group-value`:
-
-```css
-[lb-group-column="category"][lb-group-value="Income"] { color: var(--income); }
-```
-
-See [Groups](./data-binding.md#groups).
-
 ### What just happened to a row
 
 The hub stamps what its last landing did, so a stylesheet animates with
@@ -115,7 +102,7 @@ nothing else:
 | `[lb-row-changed]`             | A row whose values changed                     |
 | `[lb-row-moved]`               | A row whose values changed and now stands elsewhere; it carries `lb-row-changed` too |
 | `[lb-row-requested]`           | Any of the three, done by this page's request, as `created`, `changed` or `moved` |
-| `[lb-row-leaving]`, `[lb-group-leaving]` | A row or group on its way out; the hub removes it when its animations end |
+| `[lb-row-leaving]` | A row on its way out; the hub removes it when its animations end |
 
 ```css
 [lb-row-created] { animation: arrive 200ms; }

package/skills/loadbare-app/references/custom-elements.md

@@ -268,7 +268,7 @@ Each direction has one mechanism for each kind of message:
 
 | Direction      | What                                       | How                         | Today |
 |----------------|--------------------------------------------|-----------------------------|-------|
-| Hub to element | State that lasts                           | An attribute the hub stamps | `lb-column-value`, `lb-key-value`, `lb-query-row-count`, `lb-query-unplaced-count`, `lb-query-order`, `lb-group-*`, `lb-row-*`, `lb-request-pending`, `lb-request-error`, `lb-request-refused` |
+| Hub to element | State that lasts                           | An attribute the hub stamps | `lb-column-value`, `lb-key-value`, `lb-query-row-count`, `lb-query-unplaced-count`, `lb-query-order`, `lb-row-*`, `lb-request-pending`, `lb-request-error`, `lb-request-refused` |
 | Hub to element | State the platform already names           | A property                  | A control's `value` |
 | Hub to element | What the hub did                           | An optional `lb` method     | `lbAttached`, `lbRowsLanded`, `lbRequestDone`, `lbDetached` |
 | Hub to element | A moment an element started                | A bubbling event            | `lb-request-done` |
@@ -315,11 +315,11 @@ customElements.define("note-popup", NotePopup);
 | `lbRequestDone(detail, origin)` | After a request committed by the element, or inside it, has finished |
 | `lbDetached()`                  | Once, after it removes the element                                |
 
-The hub places an element when it starts up the chrome, shows a page,
-creates a live row, or builds a group. It places the chrome and a page as
+The hub places an element when it starts up the chrome, shows a page, or
+creates a live row. It places the chrome and a page as
 the page's first answer lands, or once that round trip fails, so an element
 in either hears `lbAttached` with the page's data in place. It removes an
-element when a live row or a group has finished leaving, and when it shows
+element when a live row has finished leaving, and when it shows
 another page in place of the one holding it. Write setup in `lbAttached` and its undoing in
 `lbDetached`; the two pair exactly, so neither guards against running
 twice.
@@ -633,8 +633,7 @@ had there hears the event, and no custom element the hub has removed hears
 
 The hub lands every row template itself, places every row by the query's
 order (see [Placing by hand](./data-binding.md#placing-by-hand)
-for when it does not), and builds every group the markup's group templates describe; see
-[Order](./data-binding.md#order) and [Groups](./data-binding.md#groups). A
+for when it does not). A
 plain element carrying `lb-query` with a row template inside it needs no
 code, so a custom element holds rows only to do something with them once
 they land.
@@ -662,8 +661,7 @@ Everything else is the hub's:
 | Cloning     | Clones the row template once per new key                 |
 | Matching    | Fills the live row already showing that key, when its values changed |
 | Placing     | Places every live row by the user's order or the query's, and leaves them where they stand for an answer under `lb-manual` |
-| Filtering   | Hides a row the user's filter does not pass, and a group whose rows are all hidden |
-| Grouping    | Builds a group where the order breaks, keeps it while its run goes on, and removes it with its last row |
+| Filtering   | Hides a row the user's filter does not pass |
 | Removing    | Marks the live rows the response says are gone as leaving, and removes them |
 | Stamping    | Stamps each live row with `lb-row-live`, `lb-key-value`, and what happened to it |
 | Counting    | Stamps `lb-query-row-count` with the number of live rows showing, `lb-query-unplaced-count` with the number out of place, and `lb-query-order` with the order placing them |