@usableapp/cardds 0.7.89 → 0.7.92

package/CHANGELOG.md

@@ -2,6 +2,45 @@
 
 > For: a project that consumes `@usableapp/cardds` and its AI — what changed between versions, written as before → after, so a screen can be brought up to date without reading the source. Newest first. A consumer never edits cardds; if something here leaves you without a way to do what you did before, report the gap.
 
+## 0.7.92 — 2026-10-15
+
+This is the first version after 0.7.90 that npm serves: 0.7.91 was tagged but never published, because the class-count check of tests/lint.spec.js (a literal, 517) had not been raised for the two classes 0.7.91 added, nor for the two added here, so the proof `npm run release` asks for failed on both tags. The count is 520 now and everything 0.7.91 listed ships in this version.
+
+One behaviour CHANGES: a `CardFeed` no longer cuts its queue to the first two cards. Before → after: a feed of more than two `FeedCard` children drew the first two (one big, one small) and nothing of the rest → it draws every one, the upper big and all the others small; a feed of two or fewer is drawn as before. Nothing else breaks: a prop pair (`onMore` + `ahead`) and two slots (`CardFeed end`, `FeedCard lead`) are added and none removed, and a feed that passes none of them is the 0.7.90 feed with the whole queue in sight.
+
+### Added
+- **`CardFeed onMore` + `ahead`: the feed asks the app for more when the member nears the end** (Lh 2026-10-15: "there are always 5 items; when the scroll reaches item 3, load 5 more"). Before → after: the app could not tell that the member had come near the end of the queue → `onMore()` is called when the card with `ahead` cards under it (default 2: with 5 cards the 3rd, with 10 the 8th) comes into view, watched with an `IntersectionObserver` on the viewport, so a scrolling ancestor counts. It asks ONCE per queue and again only after the queue changed (the app appended); never while `end` is given and never without `onMore`. A card already in view when watched asks at once, so a short queue asks straight away.
+- **`CardFeed end`: the words drawn after the last card when the app says the queue is complete.** Before → after: a feed just stopped → `end` is a `role="note"` caption centred after the last card, and with it the feed asks for no more. With no cards the feed still draws nothing, `end` or not.
+- **`FeedCard lead`: anything at the head's start in place of the icon** (a `Stamp`, an `Avatar`). Before → after: the head's start was an icon in the outlined square, by name → `lead` takes any node, drawn in both sizes; `icon` stays as it was; both given: `lead` wins and one warning says so. A `Stamp` there is the stamp's small size, 48 × 60 (`--stamp-sm-size`), and the head grows to hold it (80 tall at the gallery's size). Stories `CardFeed · More` and `StampLead`.
+
+### Changed
+- **The feed's `'queue'` ask is for a card that LEFT or an order that changed, not for an append.** Before → after: `onBigChange(upperId, 'queue')` fired whenever the ids changed → it fires only when the previous ids are not a prefix of the new ones (or the queue was empty), so cards appended at the end ask nothing and a member who scrolled down is not sent back to the top; the appended cards still fade in.
+- **The small stamp's width is one rule.** Before → after: `--stamp-sm-size` was written in two rules (`.stamp-on > .stamp` in stamp.css, `.avatar-stack > .stamp` in people.css) → one rule in stamp.css for the three holders (`.stamp-on`, `.avatar-stack`, `.feed-card__lead`); people.css keeps `flex: none; margin-inline: 0`. Computed style of all 458 stories already in the gallery identical before and after (`AvatarStack · Stamps` and every `StampOn` story included), but for `CardFeed · Default`, which now draws the whole queue (`Home · Feed` keeps two cards: the base's scroll rule is measured on it, tests/gallery-stack.spec.js).
+
+## 0.7.91 — 2026-10-15 (tagged, never published: see 0.7.92)
+
+Nothing here breaks an existing screen: one knob is added and none removed, no prop changed. The style snapshot of the 458 stories already in the gallery moved only where a note held words it had been cutting without a sign: `Sticky · LongWords` and `StampOn · Removable` (those notes now wear `sticky--small`, the words one size smaller), and `StickyScreens · Chat`, `StickyHeading · InARoom` and `StickyHeading · Ends` (the sample chat gained one long note, nine elements); every other story is identical.
+
+### Added
+- **`--sticky-small-font`** (default `--type-label`): the type a note's words are written in when they do not fit at the note's size (Lh 2026-10-15, ruled from a sketch of four ways side by side). A knob like the others: set on `:root` it retunes every note, on an element only the notes inside it. The only sizes a note's words take are the steps of the scale, so there is no second knob and no scale between.
+- **A `StickyField` stops at its note's room.** The `Sticky` it is on refuses the input that would not fit even one size smaller (six lines at the default size), and the app's `onChange` is not called for it: a typed character, a paste, a composition that overruns is not taken, the words and the caret stay where they were. An input that does not add letters (a deletion) is never refused, so a note that came over-full can still be emptied. `maxLength` is still the app's to set on top. Stories: `Sticky · Small`, `StickyField · Full`.
+
+### Changed
+- **A note's words that do not fit shrink before they are cut.** Before → after: every `Sticky` was one square and cut the words it could not hold at 22px (4.76 lines) with no sign → the note measures its own words, and when they do not fit writes them one size smaller (17px, six lines; it wears `sticky--small`); only words longer than that are cut where their room ends, as before. The note stays its one size, never grows, no ellipsis. Words that fit at 22px are as they were. A note under a `StickyHeading` on a `StickyBoard` (its words show two lines) never shrinks. There is nothing to set: the fit is measured, not a prop. A sent note that is cut after this is cut at six small lines, not four and a half.
+
+## 0.7.90 — 2026-10-13
+
+Nothing here breaks an existing screen: one component (`StickyHeading`) and four knobs are added and none removed, and a `StickyThread lapped` without a heading draws, leans and spaces every note as in 0.7.89 (computed style of all 455 stories already in the gallery identical before and after).
+
+### Added
+- **`StickyHeading`: the heading of a chat told in notes, what it is about for as long as that lasts** (Lh 2026-10-13, ruled from two sketches side by side: the plain dotted heading kept, the strip of note paper lying askew rejected — no paper, no tone, no tilt, no variant). Before → after: a chat in notes had no way to say "this chat is about a job agreed, and when", short of a note of its own among the notes → `<StickyHeading title caption />`, a subject and a short caption written on whatever it stands on with a dotted rule under it, one line where there is room (the subject, then the caption), two where there is not, a title too long for its line cut with an ellipsis. It stands in two places that already existed and no other component has a new prop: in a `Sticky`'s `stuck` (the list: across the top of that chat's note on its own paper; the note's words start under it and show two lines at most, so they never run under the foot, and a stamp stuck on the note stays) and as the FIRST child of a `StickyThread` (the room: across the thread's top on the screen's ground, staying there while the notes run under it, with 16 before the first note). The app renders it for as long as the subject lasts and stops when it ends; the notes are as they were before it. Information only, nothing to press.
+- **`StickyHeading as`: `span` (default) or `h2`.** In the room pass `as="h2"`: it is the heading of that thread, a sub-heading under the screen's h1 (the `TopBar`'s title, who the chat is with), heard as "subject caption, heading level 2". On a note keep the default: a note may be a button, and a button holds no heading, so there the words are part of the note's name (read after the note's words and its foot, because the layer that holds things stuck on a note comes after the paper).
+- **Four knobs:** `--sticky-heading-title-font` (`--type-label`), `--sticky-heading-caption-font` (`--type-caption`), `--sticky-heading-gap` (between the subject and its caption, `--sp-2`) and `--sticky-heading-room` (the room a note keeps at the top of its paper for the heading, `--sp-12` + `--sp-4`: 64). Gallery: the page `StickyHeading` after `StickyThread` in `sticky chat`, stories `InARoom`, `OnANote`, `Ends`.
+
+### Changed
+- **A thread's lean and its first post count posts only.** Before → after: `.sticky-thread--lapped > .sticky-post:nth-child(even)` turned the even children the other way and `.sticky-post:first-child` had no gap above it, so a heading as the first child of a lapped thread made every note lean the other way round and gave the first post a gap → `:nth-child(even of .sticky-post)` and `:nth-child(1 of .sticky-post)`: a thread with a heading leans exactly as the same thread without one (−2° · 2° in turn from its first note) and its first post stands 16 under the heading. A thread of posts alone is read the same as before.
+- **Taking the heading out of a room lifts the notes by its room.** Before → after (stated, not a regression): none, a heading is new → the notes keep their size, their lean and their place against the first note, and the whole run rises by the heading's height and its 16 (they stand where they stood before the subject began). In the list nothing moves: the heading is laid over the note's paper and holds no room of the board's.
+
 ## 0.7.89 — 2026-10-13
 
 Nothing here breaks an existing screen: a prop pair (`Stamp arrive` + `onArrived`) is added and none removed, a `Stamp` without `arrive` renders the html it did, and a `StampOn arrive` is struck and tells the app exactly as before (the one rule that gave it the strike lists a second holder; no keyframe, knob or class is new but `stamp--arrive`).

package/README.md

@@ -520,26 +520,33 @@ between at 40% down the screen (see *Anatomy*, "Where the centre is"):
     the one button in the head or in the content, a disabled button, a sheet, a
     stack's sheet, a modal. A card that is itself a link or a label was pressed
     whole already. Story `Card · PressedWhole`.
-  - **A feed is a queue of cards, two in sight** (Lh 2026-10-09). `CardFeed`
-    takes the WHOLE queue as `FeedCard` children, in the app's order, and shows
-    the first two: one BIG (heading, content, its button) and one SMALL (the
-    same card cut down to its head — no content, no button). A touch anywhere
-    on the small one makes it the big one and the other the small one; neither
-    changes place. The small card is itself the button (named by its heading,
-    Enter and Space) and what it does not show cannot be pressed, focused or
-    read; the big card is a plain card, pressed whole by the rule above. When
-    the two cards shown change — a card left the queue, a new one came — what
-    is left slides up, the next comes in as the lower card, and the UPPER card
-    is big, whichever was big before. One card alone is big; no card, nothing
-    is drawn. The queue is the app's: a card leaves when the app stops
-    rendering it. Which card is big is controlled like an input: `big` (a
-    card's `id`) + `onBigChange(id, 'tap' | 'queue')`, or `defaultBig`. A
-    `FeedCard` is `id` · `heading` · `caption` · `icon` (its thumb, in both
-    sizes) · `tone` · `foot` (one `Btn`: the big card is pressed whole; two
-    or more: only the buttons act) · children (the content); its size is
-    the feed's, never a prop. Knobs `--card-feed-gap`, `--feed-card-head-h`.
-    Reduced motion: nothing slides or fades. Stories `CardFeed · Default`,
-    `Home · Feed`.
+  - **A feed is a queue of cards, all in sight** (Lh 2026-10-09; the whole
+    queue 2026-10-15). `CardFeed` takes the WHOLE queue as `FeedCard`
+    children, in the app's order, and draws every one: ONE is BIG (heading,
+    content, its button) and the rest are SMALL (the same card cut down to its
+    head — no content, no button). A touch anywhere on a small one makes it
+    the big one and the big one small; none changes place. The small card is
+    itself the button (named by its heading, Enter and Space) and what it does
+    not show cannot be pressed, focused or read; the big card is a plain card,
+    pressed whole by the rule above. The queue is the app's, and so is its
+    length (5, then 10…): near the end the feed asks for more with
+    `onMore()`, once per queue, when the card with `ahead` (default 2) cards
+    under it comes into view; the app appends, and the feed asks again at the
+    new queue's card. When the app says the queue is complete it passes `end`
+    (the words drawn after the last card) and the feed asks no more. When a
+    card LEAVES or the order changes, what is left slides up and the UPPER card
+    is big, whichever was big before; cards appended at the end fade in and ask
+    nothing, so a member who scrolled down stays there. One card alone is big;
+    no card, nothing is drawn. Which card is big is controlled like an input:
+    `big` (a card's `id`) + `onBigChange(id, 'tap' | 'queue')`, or
+    `defaultBig`. A `FeedCard` is `id` · `heading` · `caption` · `icon` (its
+    thumb, in both sizes) or `lead` (anything at the head's start instead: a
+    `Stamp` is the small stamp, 48 × 60, an `Avatar`; it wins over `icon`) ·
+    `tone` · `foot` (one `Btn`: the big card is pressed whole; two or more:
+    only the buttons act) · children (the content); its size is the feed's,
+    never a prop. Knobs `--card-feed-gap`, `--feed-card-head-h`. Reduced
+    motion: nothing slides or fades. Stories `CardFeed · Default`, `More`,
+    `StampLead`, `Home · Feed`.
 - A page with **one feature and one CTA** (an install page, a single
   decision) may be contained in one card: head, the pitch, foot.
 - **A bottom sheet holds what the member acts on** — controls, or small
@@ -586,8 +593,11 @@ Live: every screen in the gallery (`npm run dev`).
 A sticky note is a square of paper with a few words on it. The family is in `src/sticky/`, its CSS in `css/sticky.css`.
 
 - **One note, one size.** Every `Sticky` is one square, 168 by default, with square corners. It never grows with its
-  words: words it cannot hold are cut where their room ends, with no ellipsis. One knob sets the side,
-  `--sticky-size`; set it on an element to resize the notes inside that element only.
+  words. Words it cannot hold at its size are written one size smaller (`--sticky-small-font`, the label size), and
+  the note then holds six lines instead of four and a half. Words longer than that are cut where their room ends, with
+  no ellipsis. A `StickyField` stops at that room: the note refuses the input that would not fit, and the app's
+  `onChange` is not called for it. One knob sets the side, `--sticky-size`; set it on an element to resize the notes
+  inside that element only.
 - **The fold says unread.** A folded bottom-right corner means the note has not been read. `flat` means it has. A
   folded note also says so to a screen reader after its words: cardds's own word by the page's language, or
   `unreadLabel`.
@@ -607,6 +617,12 @@ A sticky note is a square of paper with a few words on it. The family is in `src
   stand at the left and mine (`side="right"`) at the right, each turn lying over a corner of the one before
   (`--sticky-thread-lap` down, `--sticky-thread-lap-x` across), the time close under its note, the name only heard.
   Two turns from one side stand `--sticky-thread-same-gap` apart.
+- **`StickyHeading`** — what a chat told in notes is about, for as long as that lasts: a `title` and a short `caption`
+  (when) written on what it stands on, a dotted rule under it; information only. It stands in two places and no other
+  component has a prop for it. In a `Sticky`'s `stuck` (the list) it lies across the top of that chat's note, and the
+  note's words start under it and show two lines at most. As the first child of a `StickyThread` (the room, with
+  `as="h2"`: the sub-heading under the screen's h1) it stays at the top while the notes run under it. The app stops
+  rendering it when the subject ends. Knobs: `--sticky-heading-title-font`, `-caption-font`, `-gap`, `-room`.
 - **`StickyAnswer`** — the note you answer on. Its child is a `Sticky flat` holding a `StickyField`. At rest it waits
   at the screen's foot near the right, three quarters of it in sight (`--sticky-answer-show`). A touch on it puts the
   cursor in the field and the holder asks to write: `writing` + `onWritingChange(writing, reason)`, or

package/css/card.css

@@ -320,11 +320,12 @@
   opacity: 0.85;
 }
 
-/* ---- card feed: a queue of cards, two in sight — one big, one small (Lh 2026-10-09) ----
+/* ---- card feed: a queue of cards, all in sight — one big, the rest small (Lh 2026-10-09, the whole queue 2026-10-15) ----
    <div class="card-feed">
-     <article class="card feed-card"><div class="card__head feed-card__head">thumb · h2 · caption</div>
+     <article class="card feed-card"><div class="card__head feed-card__head">thumb or lead · h2 · caption</div>
        <div class="feed-card__more"><div class="feed-card__rest">content · <div class="card__foot">…</div></div></div></article>
      <article class="card feed-card feed-card--small" role="button" tabindex="0">… <div class="feed-card__more" inert>…</div></article>
+     <p class="t-caption card-feed__end" role="note">the end</p>
    </div>
    ONE markup in both sizes: the head always shows, the rest is a grid row that goes 1fr ↔ 0fr (never a height: Safari 16.4 has no
    interpolate-size). The card's own row gap is 0 and the rest carries it as its first thing's margin, so a small card ends on its
@@ -334,8 +335,10 @@
 .card-feed { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: var(--card-feed-gap, var(--card-gap-rest)); }
 .feed-card { row-gap: 0; }
 .feed-card__head { display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; min-height: var(--feed-card-head-h, var(--tap)); }
-.feed-card__head:has(> .card__thumb) { grid-template-columns: auto minmax(0, 1fr); }
-.feed-card__head:has(> .t-caption) > .card__thumb { grid-row: span 2; }
+.feed-card__head:has(> :is(.card__thumb, .feed-card__lead)) { grid-template-columns: auto minmax(0, 1fr); }
+.feed-card__head:has(> .t-caption) > :is(.card__thumb, .feed-card__lead) { grid-row: span 2; }
+.feed-card__lead { display: grid; align-self: center; } /* a Stamp here is the small one, 48 × 60 (stamp.css) */
+.card-feed__end { text-align: center; }
 .feed-card__more { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr; }
 .feed-card--small > .feed-card__more { grid-template-rows: 0fr; }
 .feed-card__rest {

package/css/people.css

@@ -50,10 +50,10 @@
 .avatar-stack { display: inline-flex; align-items: center; }
 .avatar-stack > .avatar { box-shadow: 0 0 0 var(--sp-1) var(--card-bg, var(--surface)); }
 .avatar-stack > .avatar + .avatar { margin-left: calc(-1 * var(--sp-3)); }
-/* a stamp in the stack is the stamp's small size, the one a stuck stamp is (--stamp-sm-size, stamp.css: 48 × 60), lapped like the heads. Measured 2026-10-11 in a Row's
+/* a stamp in the stack is the stamp's small size (--stamp-sm-size: one rule in stamp.css, 48 × 60), lapped like the heads. Measured 2026-10-11 in a Row's
    lead with a title, a meta line and an end button: at 375 the meta line breaks in two, accepted by Lh (a lap of 16 would hold it; the lap stays 8)
    <span class="avatar-stack"><span class="stamp stamp--bare">…</span><span class="stamp stamp--bare">…</span><span class="avatar-stack__more">+9</span></span> */
-.avatar-stack > .stamp { flex: none; width: var(--stamp-sm-size, var(--tap)); margin-inline: 0; }
+.avatar-stack > .stamp { flex: none; margin-inline: 0; }
 .avatar-stack > .stamp + .stamp { margin-left: calc(-1 * var(--sp-2)); }
 /* more: the count that trails the stack — plain words on the ground, title size so it reads at arm's length (the accent "+7" avatar is the small, framed way) */
 .avatar-stack__more { margin-left: var(--avatar-stack-more-gap, var(--sp-3)); font: var(--avatar-stack-more-font, var(--type-title)); color: var(--avatar-stack-more-ink, inherit); white-space: nowrap; }

package/css/stamp.css

@@ -17,7 +17,8 @@
    set of tone knobs.
    ONE SIZE (Lh 2026-10-11): a stamp, and the empty place for one, is --stamp-size wide wherever it stands — in a book, a tray,
    a card's head, a centre, a sheet, a page. What holds it only PLACES it. There is ONE other size, the small one, --stamp-sm-size
-   (one tap: half the stamp), for a stamp stuck ON something (`.stamp-on`, below) and a stamp in an avatar stack (people.css): one knob for both.
+   (one tap: half the stamp), for a stamp stuck ON something (`.stamp-on`, below), a stamp in an avatar stack (people.css) and a stamp
+   at the head of a feed card (`.feed-card__lead`, card.css): one knob for the three.
    ONE exception, by the owner's decision (Lh 2026-10-11): the stamp at a postcard's corner (post.css) is the postcard's own size, 72 × 90,
    --post-corner-stamp-w, in neither. The desk's tray (post.css) holds stamps of the standard size. */
 .stamp, .stamp-place {
@@ -211,8 +212,10 @@
   rotate: calc(var(--stamp-on-turn, 0) * 1deg);
   pointer-events: auto; /* the layer it lies in lets a tap through to the surface; the stamp itself takes it */
 }
-/* the SMALL stamp: stuck on a surface (a note). 48 × 60 whatever the surface's size. The stamp carries the size and the `.stamp-on` box is as wide as its stamp */
-.stamp-on > .stamp { width: var(--stamp-sm-size, var(--tap)); max-width: none; }
+/* the SMALL stamp, 48 × 60 whatever its holder's size, in the three places that hold it: stuck on a surface (a note), lapped in an avatar stack,
+   leading a feed card's head. The stamp carries the size and the `.stamp-on` box is as wide as its stamp */
+.stamp-on > .stamp, .avatar-stack > .stamp, .feed-card__lead > .stamp { width: var(--stamp-sm-size, var(--tap)); }
+.stamp-on > .stamp { max-width: none; }
 /* --main: the same stuck stamp at the stamp's MAIN size, 96 × 120 (--stamp-size), to cover what it lies on (the owner's call, 2026-10-11: the home's note).
    After the rule above, at the same weight: `main` is the one place a stuck stamp reads --stamp-size. */
 .stamp-on--main > .stamp { width: var(--stamp-size, calc(var(--tap) * 2)); }

package/css/sticky.css

@@ -2,8 +2,8 @@
    A note is its own paper: it brings its colour and its ink, whatever card or palette it lies on. */
 
 /* ---- sticky: a paper note — a flat pastel SQUARE of one size, the bottom-right corner folded over ----
-   ONE SIZE (Lh 2026-10-10): every note is --sticky-size square (168), whatever it says; words it cannot hold are cut where the words' room ends,
-   no ellipsis. Square corners. THE FOLD SAYS UNREAD: a folded corner = not read yet, --flat = read.
+   ONE SIZE (Lh 2026-10-10): every note is --sticky-size square (168), whatever it says; words it cannot hold are written one size smaller
+   (--sticky-small-font, the label size; Lh 2026-10-15), and past that are cut where the words' room ends, no ellipsis. Square corners. THE FOLD SAYS UNREAD: a folded corner = not read yet, --flat = read.
    Straight unless asked (--tilt-left / --tilt-right, or a holder that turns its notes), never patterned. The corner is CUT on the diagonal and a flap of a darker shade lies over it.
    <div class="sticky sticky--custard">
      <div class="sticky__paper">
@@ -80,6 +80,7 @@
 .sticky__head:has(> .sticky-date) { align-items: start; }
 .sticky__head:has(> .sticky-date) > .ph { flex: none; width: var(--sticky-pic-size, calc(var(--tap) * 1.5)); min-height: 0; aspect-ratio: 1; } /* beside a date the picture is a small square at the start */
 .sticky__body { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: clip; /* words past the note's room are cut, the foot keeps its place */ font: var(--sticky-font, var(--type-title)); overflow-wrap: anywhere; }
+.sticky--small .sticky__body { font: var(--sticky-small-font, var(--type-label)); } /* the note measured its words and they did not fit at its size (src/sticky/fit.ts) */
 .sticky__paper > :not(.sticky__body) > .chip { border-color: transparent; background-color: var(--sticky-chip-bg, rgb(255 255 255 / 0.85)); color: var(--sticky-ink, #141414); } /* a chip on a note is a label ON the paper (whose note it is): a pale ground nearly opaque (it may lie over words), no edge, the note's ink */
 .sticky__foot { flex: none; font: var(--sticky-foot-font, var(--type-caption)); color: var(--sticky-muted-ink, var(--_muted)); padding-inline-end: var(--_fold); } /* the line stops before the fold */
 /* the flap: a square in the corner — the paper's cut takes its outer half, what is left is the triangle lying on the note */
@@ -234,7 +235,7 @@
   padding-block-start: var(--sp-4); /* the first note's turned corner */
 }
 .sticky-thread--lapped > .sticky-post { position: relative; display: grid; grid-template-columns: auto; justify-self: start; justify-items: start; row-gap: var(--sticky-thread-time-gap, var(--sp-0)); margin-block-start: var(--sticky-thread-same-gap, var(--sp-2)); }
-.sticky-thread--lapped > .sticky-post:first-child { margin-block-start: 0; }
+.sticky-thread--lapped > .sticky-post:nth-child(1 of .sticky-post) { margin-block-start: 0; }
 .sticky-thread--lapped > .sticky-post--right { justify-self: end; justify-items: end; }
 .sticky-thread--lapped > .sticky-post:not(.sticky-post--right) + .sticky-post--right,
 .sticky-thread--lapped > .sticky-post--right + .sticky-post:not(.sticky-post--right) { margin-block-start: calc(-1 * var(--sticky-thread-lap, calc(var(--sp-1) * 19))); } /* 76 */
@@ -244,9 +245,9 @@
 .sticky-thread--lapped > .sticky-post > .sticky-post__head > .sticky-post__name { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /* as .t-sr: heard, not seen */
 .sticky-thread--lapped > .sticky-post > .sticky-post__head > .sticky-post__time { margin-inline: 0; }
 .sticky-thread--lapped > .sticky-post > .sticky-post__head:not(:has(> .sticky-post__time)) { display: none; }
-/* each note leans a little, one way then the other */
+/* each note leans a little, one way then the other; a post counts among posts only, so a heading before the first changes no note's lean */
 .sticky-thread--lapped > .sticky-post > .sticky-post__notes > .sticky { rotate: calc(-1 * var(--sticky-thread-tilt, 2deg)); }
-.sticky-thread--lapped > .sticky-post:nth-child(even) > .sticky-post__notes > .sticky { rotate: var(--sticky-thread-tilt, 2deg); }
+.sticky-thread--lapped > .sticky-post:nth-child(even of .sticky-post) > .sticky-post__notes > .sticky { rotate: var(--sticky-thread-tilt, 2deg); }
 /* under an answer note the thread ends with the room that note stands in: the last turn scrolls up clear of it */
 .screen:has(> .sticky-answer) .sticky-thread--lapped { padding-block-end: calc(var(--sticky-size, calc(var(--sp-12) * 3.5)) * var(--sticky-answer-show, 0.75) + var(--sp-6)); }
 
@@ -374,3 +375,31 @@
 .sticky-answer__tools > .sticky-pick { justify-content: start; }
 .sticky-answer__tray { display: grid; gap: var(--sticky-answer-tray-gap, var(--sp-2)); }
 @media (prefers-reduced-motion: reduce) { .sticky-answer__scrim, .sticky-answer__note, .sticky-answer__under { transition: none; } }
+
+/* ---- sticky heading: what the notes are about — the subject and a short caption written on whatever it stands on, a dotted rule under it ----
+   Two places, both existing ones:
+   <div class="sticky__stuck"><span class="sticky-heading"><span class="sticky-heading__title">…</span><span class="sticky-heading__caption">…</span></span></div>
+   <div class="sticky-thread sticky-thread--lapped"><h2 class="sticky-heading">…</h2><div class="sticky-post">…</div>…</div> */
+.sticky-heading {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  column-gap: var(--sticky-heading-gap, var(--sp-2));
+  box-sizing: border-box;
+  min-width: 0;
+  margin: 0;
+  padding-block-end: var(--sp-0);
+  border-block-end: var(--rule-w) dotted currentColor;
+  font: inherit;
+}
+.sticky-heading__title { min-width: 0; max-width: 100%; font: var(--sticky-heading-title-font, var(--type-label)); line-height: 1.35; /* Thai marks stack taller than the label's 1.2, and overflow clips them */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.sticky-heading__caption { font: var(--sticky-heading-caption-font, var(--type-caption)); color: color-mix(in srgb, currentColor 62%, transparent); white-space: nowrap; }
+/* on a note: across the top of its paper, and the note's words start under it */
+.sticky__stuck > .sticky-heading { position: absolute; inset: var(--sp-2) var(--sp-4) auto; }
+.sticky:has(> .sticky__stuck > .sticky-heading) > .sticky__paper { padding-block-start: var(--sticky-heading-room, calc(var(--sp-12) + var(--sp-4))); }
+/* on a board the foot lies over the note's last line: under a heading the words are two lines, clear of it */
+.sticky-board .sticky:has(> .sticky__stuck > .sticky-heading) .sticky__body { flex: none; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
+/* in a thread: across its top on the screen's ground, staying there while the notes run under it; the room before the first note is the turned corner's, as the thread's own top */
+/* the ground is drawn a little wider than the heading each way: a turned note's corner and its shadow stand outside the thread's width */
+.sticky-thread > .sticky-heading { position: sticky; inset-block-start: 0; z-index: 2; padding-block-start: var(--sp-2); background: var(--surface); color: var(--on-surface); box-shadow: calc(-1 * var(--sp-3)) 0 0 var(--surface), var(--sp-3) 0 0 var(--surface); }
+.sticky-thread--lapped > .sticky-heading { margin-block-end: var(--sp-4); }

package/dist/cardds.css

@@ -1012,11 +1012,12 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
   opacity: 0.85;
 }
 
-/* ---- card feed: a queue of cards, two in sight — one big, one small (Lh 2026-10-09) ----
+/* ---- card feed: a queue of cards, all in sight — one big, the rest small (Lh 2026-10-09, the whole queue 2026-10-15) ----
    <div class="card-feed">
-     <article class="card feed-card"><div class="card__head feed-card__head">thumb · h2 · caption</div>
+     <article class="card feed-card"><div class="card__head feed-card__head">thumb or lead · h2 · caption</div>
        <div class="feed-card__more"><div class="feed-card__rest">content · <div class="card__foot">…</div></div></div></article>
      <article class="card feed-card feed-card--small" role="button" tabindex="0">… <div class="feed-card__more" inert>…</div></article>
+     <p class="t-caption card-feed__end" role="note">the end</p>
    </div>
    ONE markup in both sizes: the head always shows, the rest is a grid row that goes 1fr ↔ 0fr (never a height: Safari 16.4 has no
    interpolate-size). The card's own row gap is 0 and the rest carries it as its first thing's margin, so a small card ends on its
@@ -1026,8 +1027,10 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
 .card-feed { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: var(--card-feed-gap, var(--card-gap-rest)); }
 .feed-card { row-gap: 0; }
 .feed-card__head { display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; min-height: var(--feed-card-head-h, var(--tap)); }
-.feed-card__head:has(> .card__thumb) { grid-template-columns: auto minmax(0, 1fr); }
-.feed-card__head:has(> .t-caption) > .card__thumb { grid-row: span 2; }
+.feed-card__head:has(> :is(.card__thumb, .feed-card__lead)) { grid-template-columns: auto minmax(0, 1fr); }
+.feed-card__head:has(> .t-caption) > :is(.card__thumb, .feed-card__lead) { grid-row: span 2; }
+.feed-card__lead { display: grid; align-self: center; } /* a Stamp here is the small one, 48 × 60 (stamp.css) */
+.card-feed__end { text-align: center; }
 .feed-card__more { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr; }
 .feed-card--small > .feed-card__more { grid-template-rows: 0fr; }
 .feed-card__rest {
@@ -3215,10 +3218,10 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
 .avatar-stack { display: inline-flex; align-items: center; }
 .avatar-stack > .avatar { box-shadow: 0 0 0 var(--sp-1) var(--card-bg, var(--surface)); }
 .avatar-stack > .avatar + .avatar { margin-left: calc(-1 * var(--sp-3)); }
-/* a stamp in the stack is the stamp's small size, the one a stuck stamp is (--stamp-sm-size, stamp.css: 48 × 60), lapped like the heads. Measured 2026-10-11 in a Row's
+/* a stamp in the stack is the stamp's small size (--stamp-sm-size: one rule in stamp.css, 48 × 60), lapped like the heads. Measured 2026-10-11 in a Row's
    lead with a title, a meta line and an end button: at 375 the meta line breaks in two, accepted by Lh (a lap of 16 would hold it; the lap stays 8)
    <span class="avatar-stack"><span class="stamp stamp--bare">…</span><span class="stamp stamp--bare">…</span><span class="avatar-stack__more">+9</span></span> */
-.avatar-stack > .stamp { flex: none; width: var(--stamp-sm-size, var(--tap)); margin-inline: 0; }
+.avatar-stack > .stamp { flex: none; margin-inline: 0; }
 .avatar-stack > .stamp + .stamp { margin-left: calc(-1 * var(--sp-2)); }
 /* more: the count that trails the stack — plain words on the ground, title size so it reads at arm's length (the accent "+7" avatar is the small, framed way) */
 .avatar-stack__more { margin-left: var(--avatar-stack-more-gap, var(--sp-3)); font: var(--avatar-stack-more-font, var(--type-title)); color: var(--avatar-stack-more-ink, inherit); white-space: nowrap; }
@@ -3798,8 +3801,8 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
    A note is its own paper: it brings its colour and its ink, whatever card or palette it lies on. */
 
 /* ---- sticky: a paper note — a flat pastel SQUARE of one size, the bottom-right corner folded over ----
-   ONE SIZE (Lh 2026-10-10): every note is --sticky-size square (168), whatever it says; words it cannot hold are cut where the words' room ends,
-   no ellipsis. Square corners. THE FOLD SAYS UNREAD: a folded corner = not read yet, --flat = read.
+   ONE SIZE (Lh 2026-10-10): every note is --sticky-size square (168), whatever it says; words it cannot hold are written one size smaller
+   (--sticky-small-font, the label size; Lh 2026-10-15), and past that are cut where the words' room ends, no ellipsis. Square corners. THE FOLD SAYS UNREAD: a folded corner = not read yet, --flat = read.
    Straight unless asked (--tilt-left / --tilt-right, or a holder that turns its notes), never patterned. The corner is CUT on the diagonal and a flap of a darker shade lies over it.
    <div class="sticky sticky--custard">
      <div class="sticky__paper">
@@ -3876,6 +3879,7 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
 .sticky__head:has(> .sticky-date) { align-items: start; }
 .sticky__head:has(> .sticky-date) > .ph { flex: none; width: var(--sticky-pic-size, calc(var(--tap) * 1.5)); min-height: 0; aspect-ratio: 1; } /* beside a date the picture is a small square at the start */
 .sticky__body { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: clip; /* words past the note's room are cut, the foot keeps its place */ font: var(--sticky-font, var(--type-title)); overflow-wrap: anywhere; }
+.sticky--small .sticky__body { font: var(--sticky-small-font, var(--type-label)); } /* the note measured its words and they did not fit at its size (src/sticky/fit.ts) */
 .sticky__paper > :not(.sticky__body) > .chip { border-color: transparent; background-color: var(--sticky-chip-bg, rgb(255 255 255 / 0.85)); color: var(--sticky-ink, #141414); } /* a chip on a note is a label ON the paper (whose note it is): a pale ground nearly opaque (it may lie over words), no edge, the note's ink */
 .sticky__foot { flex: none; font: var(--sticky-foot-font, var(--type-caption)); color: var(--sticky-muted-ink, var(--_muted)); padding-inline-end: var(--_fold); } /* the line stops before the fold */
 /* the flap: a square in the corner — the paper's cut takes its outer half, what is left is the triangle lying on the note */
@@ -4030,7 +4034,7 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
   padding-block-start: var(--sp-4); /* the first note's turned corner */
 }
 .sticky-thread--lapped > .sticky-post { position: relative; display: grid; grid-template-columns: auto; justify-self: start; justify-items: start; row-gap: var(--sticky-thread-time-gap, var(--sp-0)); margin-block-start: var(--sticky-thread-same-gap, var(--sp-2)); }
-.sticky-thread--lapped > .sticky-post:first-child { margin-block-start: 0; }
+.sticky-thread--lapped > .sticky-post:nth-child(1 of .sticky-post) { margin-block-start: 0; }
 .sticky-thread--lapped > .sticky-post--right { justify-self: end; justify-items: end; }
 .sticky-thread--lapped > .sticky-post:not(.sticky-post--right) + .sticky-post--right,
 .sticky-thread--lapped > .sticky-post--right + .sticky-post:not(.sticky-post--right) { margin-block-start: calc(-1 * var(--sticky-thread-lap, calc(var(--sp-1) * 19))); } /* 76 */
@@ -4040,9 +4044,9 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
 .sticky-thread--lapped > .sticky-post > .sticky-post__head > .sticky-post__name { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /* as .t-sr: heard, not seen */
 .sticky-thread--lapped > .sticky-post > .sticky-post__head > .sticky-post__time { margin-inline: 0; }
 .sticky-thread--lapped > .sticky-post > .sticky-post__head:not(:has(> .sticky-post__time)) { display: none; }
-/* each note leans a little, one way then the other */
+/* each note leans a little, one way then the other; a post counts among posts only, so a heading before the first changes no note's lean */
 .sticky-thread--lapped > .sticky-post > .sticky-post__notes > .sticky { rotate: calc(-1 * var(--sticky-thread-tilt, 2deg)); }
-.sticky-thread--lapped > .sticky-post:nth-child(even) > .sticky-post__notes > .sticky { rotate: var(--sticky-thread-tilt, 2deg); }
+.sticky-thread--lapped > .sticky-post:nth-child(even of .sticky-post) > .sticky-post__notes > .sticky { rotate: var(--sticky-thread-tilt, 2deg); }
 /* under an answer note the thread ends with the room that note stands in: the last turn scrolls up clear of it */
 .screen:has(> .sticky-answer) .sticky-thread--lapped { padding-block-end: calc(var(--sticky-size, calc(var(--sp-12) * 3.5)) * var(--sticky-answer-show, 0.75) + var(--sp-6)); }
 
@@ -4171,6 +4175,34 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
 .sticky-answer__tray { display: grid; gap: var(--sticky-answer-tray-gap, var(--sp-2)); }
 @media (prefers-reduced-motion: reduce) { .sticky-answer__scrim, .sticky-answer__note, .sticky-answer__under { transition: none; } }
 
+/* ---- sticky heading: what the notes are about — the subject and a short caption written on whatever it stands on, a dotted rule under it ----
+   Two places, both existing ones:
+   <div class="sticky__stuck"><span class="sticky-heading"><span class="sticky-heading__title">…</span><span class="sticky-heading__caption">…</span></span></div>
+   <div class="sticky-thread sticky-thread--lapped"><h2 class="sticky-heading">…</h2><div class="sticky-post">…</div>…</div> */
+.sticky-heading {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  column-gap: var(--sticky-heading-gap, var(--sp-2));
+  box-sizing: border-box;
+  min-width: 0;
+  margin: 0;
+  padding-block-end: var(--sp-0);
+  border-block-end: var(--rule-w) dotted currentColor;
+  font: inherit;
+}
+.sticky-heading__title { min-width: 0; max-width: 100%; font: var(--sticky-heading-title-font, var(--type-label)); line-height: 1.35; /* Thai marks stack taller than the label's 1.2, and overflow clips them */ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.sticky-heading__caption { font: var(--sticky-heading-caption-font, var(--type-caption)); color: color-mix(in srgb, currentColor 62%, transparent); white-space: nowrap; }
+/* on a note: across the top of its paper, and the note's words start under it */
+.sticky__stuck > .sticky-heading { position: absolute; inset: var(--sp-2) var(--sp-4) auto; }
+.sticky:has(> .sticky__stuck > .sticky-heading) > .sticky__paper { padding-block-start: var(--sticky-heading-room, calc(var(--sp-12) + var(--sp-4))); }
+/* on a board the foot lies over the note's last line: under a heading the words are two lines, clear of it */
+.sticky-board .sticky:has(> .sticky__stuck > .sticky-heading) .sticky__body { flex: none; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
+/* in a thread: across its top on the screen's ground, staying there while the notes run under it; the room before the first note is the turned corner's, as the thread's own top */
+/* the ground is drawn a little wider than the heading each way: a turned note's corner and its shadow stand outside the thread's width */
+.sticky-thread > .sticky-heading { position: sticky; inset-block-start: 0; z-index: 2; padding-block-start: var(--sp-2); background: var(--surface); color: var(--on-surface); box-shadow: calc(-1 * var(--sp-3)) 0 0 var(--surface), var(--sp-3) 0 0 var(--surface); }
+.sticky-thread--lapped > .sticky-heading { margin-block-end: var(--sp-4); }
+
 /* ---- css/stamp.css — stamp, empty place, album page, a stamp stuck on a surface ---- */
 /* cardds — stamps: the paper stamp, an empty place for one, the album page, a stamp stuck on a surface.
    A stamp is its own paper, like a sticky note: it brings its ground and its ink, whatever card or palette it lies on.
@@ -4191,7 +4223,8 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
    set of tone knobs.
    ONE SIZE (Lh 2026-10-11): a stamp, and the empty place for one, is --stamp-size wide wherever it stands — in a book, a tray,
    a card's head, a centre, a sheet, a page. What holds it only PLACES it. There is ONE other size, the small one, --stamp-sm-size
-   (one tap: half the stamp), for a stamp stuck ON something (`.stamp-on`, below) and a stamp in an avatar stack (people.css): one knob for both.
+   (one tap: half the stamp), for a stamp stuck ON something (`.stamp-on`, below), a stamp in an avatar stack (people.css) and a stamp
+   at the head of a feed card (`.feed-card__lead`, card.css): one knob for the three.
    ONE exception, by the owner's decision (Lh 2026-10-11): the stamp at a postcard's corner (post.css) is the postcard's own size, 72 × 90,
    --post-corner-stamp-w, in neither. The desk's tray (post.css) holds stamps of the standard size. */
 .stamp, .stamp-place {
@@ -4385,8 +4418,10 @@ button:enabled { cursor: pointer; } /* a disabled one keeps the arrow */
   rotate: calc(var(--stamp-on-turn, 0) * 1deg);
   pointer-events: auto; /* the layer it lies in lets a tap through to the surface; the stamp itself takes it */
 }
-/* the SMALL stamp: stuck on a surface (a note). 48 × 60 whatever the surface's size. The stamp carries the size and the `.stamp-on` box is as wide as its stamp */
-.stamp-on > .stamp { width: var(--stamp-sm-size, var(--tap)); max-width: none; }
+/* the SMALL stamp, 48 × 60 whatever its holder's size, in the three places that hold it: stuck on a surface (a note), lapped in an avatar stack,
+   leading a feed card's head. The stamp carries the size and the `.stamp-on` box is as wide as its stamp */
+.stamp-on > .stamp, .avatar-stack > .stamp, .feed-card__lead > .stamp { width: var(--stamp-sm-size, var(--tap)); }
+.stamp-on > .stamp { max-width: none; }
 /* --main: the same stuck stamp at the stamp's MAIN size, 96 × 120 (--stamp-size), to cover what it lies on (the owner's call, 2026-10-11: the home's note).
    After the rule above, at the same weight: `main` is the one place a stuck stamp reads --stamp-size. */
 .stamp-on--main > .stamp { width: var(--stamp-size, calc(var(--tap) * 2)); }

package/dist/cards/CardFeed.d.ts

@@ -4,23 +4,31 @@ import { type IconName } from '../type/Icon.js';
 /** why the feed asks for another big card: the member touched the small one · the two cards shown changed */
 export type CardFeedReason = 'tap' | 'queue';
 export interface CardFeedProps extends ComponentProps<'div'> {
-    /** CONTROLLED: the `id` of the card shown big — with `onBigChange`; or `defaultBig`. An id that is not one of the two cards shown reads as the upper one */
+    /** CONTROLLED: the `id` of the card shown big — with `onBigChange`; or `defaultBig`. An id that names no card of the queue reads as the upper one */
     big?: string;
     /** UNCONTROLLED: the card big on arrival (default: the upper one); the feed then keeps its own. Pair of `big` */
     defaultBig?: string;
-    /** the feed asks for another big card: its `id`, and why — `tap` (the member touched the small card) · `queue` (the two cards shown changed: the upper one is asked for) */
+    /** the feed asks for another big card: its `id`, and why — `tap` (the member touched a small card) · `queue` (a card left the queue, or the order changed: the upper card is asked for; cards appended at the end ask nothing) */
     onBigChange?: (id: string, reason: CardFeedReason) => void;
-    /** the WHOLE queue, in the app's order: one `FeedCard` each, as direct children. The feed draws the first two */
+    /** the member is near the end of the queue: the app appends more cards (and passes `end` when there are none). Asked ONCE per queue, when the card with `ahead` cards under it comes into view; asked again only after the queue changed. Never asked while `end` is given */
+    onMore?: () => void;
+    /** how many cards are still under the one that asks (default 2): with 5 cards the 3rd asks, with 10 the 8th */
+    ahead?: number;
+    /** the words drawn after the last card, when the app says the queue is complete — they stop `onMore`. No card, nothing is drawn, these words too */
+    end?: ReactNode;
+    /** the WHOLE queue, in the app's order: one `FeedCard` each, as direct children. The feed draws every one of them */
     children?: ReactNode;
 }
 /**
- * CardFeed — a QUEUE of cards the system hands the member one after another; at most two are on the screen: one BIG (heading, content,
- * its button) and one SMALL (the same card cut down to its head). A touch anywhere on the small one makes it the big one and the other
- * the small one; neither changes place. The queue is the app's: when it changes (a card left, a new one came) what is left slides up,
- * the next comes in as the lower card, and the feed asks for the UPPER card to be big, whichever was big before. One card alone is big;
- * no card, nothing is drawn. Which card is big is controlled like an input (`big` + `onBigChange`, or `defaultBig`).
+ * CardFeed — a QUEUE of cards the system hands the member one after another, all of them on the screen: one BIG (heading, content, its
+ * button) and every other SMALL (the same card cut down to its head). A touch anywhere on a small one makes it the big one and the big
+ * one small; none changes place. The queue is the app's, and so is its length (5, then 10…): near its end the feed asks for more
+ * (`onMore`, at the card with `ahead` cards under it) and the app appends; the appended cards fade in and the member stays where they
+ * were. When a card LEAVES or the order changes, what is left slides up and the feed asks for the UPPER card to be big. When the
+ * app says the queue is complete (`end`) the feed draws those words after the last card and stops asking. One card alone is big; no
+ * card, nothing is drawn. Which card is big is controlled like an input (`big` + `onBigChange`, or `defaultBig`).
  */
-export declare function CardFeed({ big: bigProp, defaultBig, onBigChange, className, children, ref, ...rest }: CardFeedProps): import("react").JSX.Element | null;
+export declare function CardFeed({ big: bigProp, defaultBig, onBigChange, onMore, ahead, end, className, children, ref, ...rest }: CardFeedProps): import("react").JSX.Element | null;
 export interface FeedCardProps extends Omit<ComponentProps<'article'>, 'id' | 'role' | 'tabIndex'> {
     /** which card of the queue this is — the app's own id for it, unique in the feed. `CardFeed big` / `onBigChange` speak in these */
     id: string;
@@ -28,8 +36,10 @@ export interface FeedCardProps extends Omit<ComponentProps<'article'>, 'id' | 'r
     heading: ReactNode;
     /** the muted line under the heading, shown in both sizes */
     caption?: ReactNode;
-    /** the card's thumb at the head's start: an icon by name, drawn in both sizes */
+    /** the card's thumb at the head's start: an icon by name in the outlined square, drawn in both sizes. Ignored when `lead` is given */
     icon?: IconName;
+    /** anything at the head's start in place of the icon, drawn in both sizes: a `Stamp` (the small one, 48 × 60, the icon's square is not drawn), an `Avatar`. Wins over `icon` */
+    lead?: ReactNode;
     /** the tone slot — see `Tone` */
     tone?: Tone;
     /** the card's button, or its buttons — shown only while the card is big. ONE `Btn`: the big card is pressed whole, a touch anywhere on it runs that button. Two or more (a question: yes · no): only the buttons act, a touch elsewhere on the card does nothing */
@@ -38,9 +48,9 @@ export interface FeedCardProps extends Omit<ComponentProps<'article'>, 'id' | 'r
     children?: ReactNode;
 }
 /**
- * FeedCard — ONE card of a `CardFeed`'s queue, the same markup in both sizes: its head (thumb · heading · caption) always shows, its
+ * FeedCard — ONE card of a `CardFeed`'s queue, the same markup in both sizes: its head (thumb or lead · heading · caption) always shows, its
  * content and its button are one part that opens while the card is big. The SIZE IS THE FEED'S, never a prop. Small, the card itself
  * is the control (a button named by its heading; Enter and Space) and its closed part cannot be pressed, focused or read. Big, it is a
  * plain card: with one button in its foot it is pressed whole; with two or more only the buttons act.
  */
-export declare function FeedCard({ id, heading, caption, icon, tone, foot, className, children, onClick, onKeyDown, ref, ...rest }: FeedCardProps): import("react").JSX.Element;
+export declare function FeedCard({ id, heading, caption, icon, lead, tone, foot, className, children, onClick, onKeyDown, ref, ...rest }: FeedCardProps): import("react").JSX.Element;