@supersuit/suggest-a-change 0.1.8 → 0.1.10

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.1.10 (2026-10-17)
+
+- **What goes with it is one small line.** The sheet no longer draws a section with a legend, an explainer and four switches above Send. Every diagnostic (the app's version, the time, the screen size, the phone type) goes with every report, beside the screen's name and address, and one muted line says what goes and to whom. Whoever acts on a report needs all of them, so leaving one out only ever cost a round trip. The `Words` keys the switches used (`withLegend`, `alwaysSent`, `include`, `screenName`) stay, so an app that overrides them still typechecks.
+
+## 0.1.9 (2026-10-17)
+
+- **The door helpers are exported from `./server`.** `json`, `signIn`, `notFound`, `cappedText` and `peek` are what an app's own route wrapper needs to answer as the handlers do and never read a body past a cap. Two apps (cofounders-template, first-years-template) carried byte-identical copies; they now import these. The handlers use the same functions, so there is one copy of the door. No behaviour change.
+
 ## 0.1.8 (2026-10-17)
 
 - **The news reaches a person whose entry sits in a menu.** In the Cofounders and Us apps the entry lives in a three-dot menu that stays closed and remounts it on every open, so the 0.1.7 dot was never seen and the toast was drawn inside the closed menu. New in `./client`: `<SuggestNews adapters>`, mounted once at the root, shows the toast with no entry on screen (and keeps the outbox moving); `useSuggestNews(adapters)` returns `{ moved }` for the menu's trigger; `<SuggestDot adapters moved>` draws the entry's dot there (nothing at 0), and the class `sac-dot-host` gives the trigger the `position: relative` it needs. The toast is once per page load and account however many times the entry mounts, whichever of these asks first. `<SuggestEntry>` keeps its own dot and, alone, behaves as in 0.1.7.

package/README.md

@@ -69,7 +69,7 @@ Styling: structure only, class names prefixed `sac-`. `@supersuit/suggest-a-chan
 | `--sac-backdrop` | `rgba(0, 0, 0, 0.45)` | the dim behind the sheet |
 | `--sac-focus` | `#1a56db` | focus rings |
 
-The four diagnostics are the app's version, the time, the screen size and the phone type; the app's version and the phone type are on by default and the time and screen size are off (the report's id and the app's own received time already say when it was sent), and the screen's name and address are always sent and shown as such.
+The four diagnostics are the app's version, the time, the screen size and the phone type. All four go with every report, with the screen's name and address, and the sheet says so in one small line above Send rather than a section of switches.
 
 **Identity.** Every screen asks `adapters.identity()` when it mounts, whenever it is handed a different `adapters` object, and whenever the host calls `refreshIdentity()` (exported from `"./client"`; call it after a sign-in, sign-out or account switch). When the account differs, the old account's rows leave the screen and its waiting reports stay on the phone, to be sent only while that account is signed in; every send re-confirms the account first. Keep `adapters` stable where you can; a parent that rebuilds it every render is safe, only slower (one `identity()` call per render).
 
@@ -212,6 +212,8 @@ A client adapter's `uploadPart` asks `upload-url`, PUTs the bytes straight to st
 
 The role stored on a report comes from the signed-in member and the `maintainers` list. A `who` sent by the phone is ignored; a report carrying `timeline`, `status`, `plan` or `decision` is refused. `sniffType(firstBytes)` names a file by its bytes (jpeg, png, webp, heic/heif, gif, mp4/mov, webm, m4a/aac, mp3, wav, ogg/opus; anything else is `null`) and `finalize` refuses a file whose bytes are not the type it was declared as.
 
+**A wrapper of your own answers in the module's words.** When an app's route has to check a caller or read one field before the handler runs, it uses the same door the handlers use: `json(status, body)` (JSON, never cached), `signIn()` (401) and `notFound()` (404), `cappedText(req, cap)` (the body as text, or a 413 `Response` past `cap` bytes, by the declared length and again by counting what arrives; no body reads as `""`), and `peek(text)` (a JSON object, or `{}` for anything else, for reading one field while the module judges the body). Copying these into an app made a second door that could drift from the first.
+
 **Settle carries a revision.** `agentList` gives each report a `revision`; the Mac sends it back with `settle`, and the store settles only if the report still has exactly that content. A follow-up or file that arrived in between answers 409 `stale`, drops the claim, and the next list offers the report with the addition. Adapters compute the same value with `reportRevision`.
 
 **The collector MUST verify.** `agentFile` answers the verified `bytes` and `sha256`; a Mac that downloads the link must check both before it trusts the file.

package/dist/client/sheet.js

@@ -69,8 +69,6 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
     const [answers, setAnswers] = useState({ ...NO_ANSWERS, happened: initial?.happened ?? '' });
     const [voice, setVoice] = useState([]);
     const [media, setMedia] = useState([]);
-    // The design's example line is the default: version, screen name (always) and phone type. The time and the screen size are opt-in.
-    const [on, setOn] = useState({ appVersion: true, at: false, screen: false, device: true });
     const [error, setError] = useState('');
     const [announce, setAnnounce] = useState('');
     const [sent, setSent] = useState(null);
@@ -253,17 +251,16 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
         await rt?.store.del('kv', metaKey(v.key));
         setAnnounce(S.voiceNoteRemoved);
     }
-    // What goes with it: exactly the contract's four diagnostics, each with a switch that really removes it.
-    // Where the person was (the screen's name and address) is what the report is about, so it is always sent and shown as such.
+    // What goes with it: the contract's four diagnostics, always sent, with no switches. Whoever reads the report
+    // needs the device, the time and the screen to act on it, so leaving one out only ever cost a round trip.
+    // The sheet says so in one small FYI line rather than a section to configure.
     const avail = [
         { name: 'appVersion', label: S.diagAppVersion, value: adapters.about?.version },
         { name: 'at', label: S.diagAt, value: new Date(adapters.phone?.now?.() ?? Date.now()).toISOString() },
         { name: 'screen', label: S.diagScreen, value: screenSize() },
         { name: 'device', label: S.diagDevice, value: adapters.device ? adapters.device() : phoneType() },
     ].filter((d) => Boolean(d.value));
-    // The design's order: the app's version, this screen's name (always), then whatever else is on, phone type last.
-    const isOn = (n) => avail.find((d) => d.name === n && on[d.name])?.label;
-    const lineParts = [isOn('appVersion'), S.screenName, isOn('at'), isOn('screen'), isOn('device')].filter((x) => Boolean(x));
+    const lineParts = [`this screen (${where.screen}, ${sanitizeRoute(where.route)})`, ...avail.map((d) => d.label)];
     const summary = `${S.goesTo(adapters.words.owner)} ${S.includes(lineParts)}`;
     // Answers to the broken questions only count while the kind is broken: they are not sent otherwise.
     const hasAnything = Boolean(words.trim() || voice.length || media.length || (kind === 'broken' && (answers.happened.trim() || answers.expected.trim() || answers.steps.trim())));
@@ -275,8 +272,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
         const d = await saveDraft(rt.store, key, { kind, words, attachments: [...voice.map((v) => v.key), ...media.map((m) => m.key)] });
         const diagnostics = {};
         for (const x of avail)
-            if (on[x.name])
-                diagnostics[x.name] = x.value;
+            diagnostics[x.name] = x.value;
         const report = {
             id: d.reportId,
             kind,
@@ -335,5 +331,5 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
     return (_jsx("div", { className: "sac-backdrop", "data-suggest-sheet": "", children: _jsxs("div", { ref: box, className: "sac-sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, tabIndex: -1, children: [_jsxs("header", { className: "sac-header", children: [_jsx("h2", { id: titleId, className: "sac-title", children: S.sheetTitle }), onClose ? _jsx("button", { type: "button", className: "sac-button sac-close", onClick: onClose, children: S.close }) : null] }), _jsx("div", { className: "sac-sr", "data-sac-live": "", role: "status", "aria-live": "polite", "aria-atomic": "true", children: announce }), who === undefined ? _jsx("p", { children: S.loading }) : who === null ? _jsx("p", { role: "alert", children: S.signedOut }) : !rt ? _jsx("p", { children: S.loading }) : sent ? (_jsxs("div", { className: "sac-sent", children: [_jsx(Receipt, { adapters: adapters, reportId: sent.id, quiet: true, onLine: setAnnounce }), sent.files.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: sent.files.map((f) => {
                                 const p = rt.part(sent.id, f.file);
                                 return (_jsxs("li", { className: "sac-item", "data-attachment-state": p.state, children: [_jsxs("span", { className: "sac-item-name", children: [f.name, f.bytes ? `, ${sizeWords(f.bytes)}` : ''] }), _jsxs("span", { className: "sac-item-state", children: [p.state === 'sending' ? _jsx("progress", { "aria-label": `${S.sending} ${f.name}` }) : null, p.state === 'waiting' ? S.waitingToSend : p.state === 'sending' ? S.sending : p.state === 'sent' ? S.sentWord : S.didNotSend(p.reason ?? '')] }), p.state === 'failed' ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void rt.retry(sent.id), children: S.retry }) : null] }, f.file));
-                            }) })) : null, onClose ? _jsx("button", { type: "button", className: "sac-button sac-primary", onClick: onClose, children: S.done }) : null] })) : (_jsxs("form", { className: "sac-form", onSubmit: (e) => { e.preventDefault(); void send(); }, children: [_jsxs("fieldset", { role: "radiogroup", className: "sac-group sac-kinds", children: [_jsx("legend", { children: S.kindLegend }), kinds.map((k) => (_jsxs("label", { className: "sac-choice", children: [_jsx("input", { type: "radio", name: "sac-kind", value: k.id, checked: kind === k.id, onChange: () => setKind(k.id) }), _jsx("span", { children: k.label })] }, k.id)))] }), kind === 'broken' ? (_jsxs("fieldset", { className: "sac-group", children: [_jsxs("legend", { children: [S.kindBroken, " (", S.optional, ")"] }), fieldFor('happened', S.brokenHappened, answers.happened, (v) => setAnswers((a) => ({ ...a, happened: v }))), fieldFor('expected', S.brokenExpected, answers.expected, (v) => setAnswers((a) => ({ ...a, expected: v }))), fieldFor('steps', S.brokenSteps, answers.steps, (v) => setAnswers((a) => ({ ...a, steps: v })))] })) : null, _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.sayItLegend }), fieldFor('words', S.sayItLabel, words, setWords, { placeholder: S.sayItPlaceholder }), voice.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.voiceNotesLabel, children: voice.map((v, i) => (_jsxs("li", { className: "sac-item", children: [_jsx("span", { className: "sac-item-name", children: S.voiceNote(i + 1, lengthWords(v.ms)) }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${S.voiceNote(i + 1, lengthWords(v.ms))}`, onClick: () => void removeVoice(v), children: S.remove })] }, v.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.showItLegend }), _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "button", className: "sac-button", onClick: () => fileInput.current?.click(), children: S.addImages }), _jsx("button", { type: "button", className: "sac-button", onClick: () => videoInput.current?.click(), children: S.addVideo }), adapters.snapshot ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void takeScreenshot(), children: S.takeScreenshot }) : null] }), _jsx("input", { ref: fileInput, type: "file", accept: "image/*", multiple: true, hidden: true, "aria-label": S.addImages, "data-sac-images": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'image'); } }), _jsx("input", { ref: videoInput, type: "file", accept: "video/*", hidden: true, "aria-label": S.addVideo, "data-sac-video": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'video'); } }), media.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: media.map((m) => (_jsxs("li", { className: "sac-item", children: [_jsxs("span", { className: "sac-item-name", children: [m.name, ", ", sizeWords(m.bytes)] }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${m.name}`, onClick: () => void removeMedia(m), children: S.remove })] }, m.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.withLegend }), _jsx("p", { className: "sac-summary", "data-sac-summary": "", "aria-live": "polite", children: summary }), _jsx("p", { className: "sac-muted", "data-sac-where": "", children: S.alwaysSent(where.screen, sanitizeRoute(where.route)) }), avail.map((d) => (_jsxs("label", { className: "sac-switch", children: [_jsx("input", { type: "checkbox", role: "switch", checked: on[d.name], "aria-label": S.include(d.label), onChange: (e) => setOn((cur) => ({ ...cur, [d.name]: e.target.checked })) }), _jsxs("span", { children: [d.label, ": ", _jsx("span", { className: "sac-muted", children: d.value })] })] }, d.name)))] }), error ? _jsx("p", { role: "alert", className: "sac-error", children: error }) : null, _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "submit", className: "sac-button sac-primary", disabled: !hasAnything, "aria-describedby": hasAnything ? undefined : `${titleId}-hint`, children: S.send }), hasAnything ? null : _jsx("span", { id: `${titleId}-hint`, className: "sac-muted", children: S.sendHint })] })] })), _jsx(Toasts, {})] }) }));
+                            }) })) : null, onClose ? _jsx("button", { type: "button", className: "sac-button sac-primary", onClick: onClose, children: S.done }) : null] })) : (_jsxs("form", { className: "sac-form", onSubmit: (e) => { e.preventDefault(); void send(); }, children: [_jsxs("fieldset", { role: "radiogroup", className: "sac-group sac-kinds", children: [_jsx("legend", { children: S.kindLegend }), kinds.map((k) => (_jsxs("label", { className: "sac-choice", children: [_jsx("input", { type: "radio", name: "sac-kind", value: k.id, checked: kind === k.id, onChange: () => setKind(k.id) }), _jsx("span", { children: k.label })] }, k.id)))] }), kind === 'broken' ? (_jsxs("fieldset", { className: "sac-group", children: [_jsxs("legend", { children: [S.kindBroken, " (", S.optional, ")"] }), fieldFor('happened', S.brokenHappened, answers.happened, (v) => setAnswers((a) => ({ ...a, happened: v }))), fieldFor('expected', S.brokenExpected, answers.expected, (v) => setAnswers((a) => ({ ...a, expected: v }))), fieldFor('steps', S.brokenSteps, answers.steps, (v) => setAnswers((a) => ({ ...a, steps: v })))] })) : null, _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.sayItLegend }), fieldFor('words', S.sayItLabel, words, setWords, { placeholder: S.sayItPlaceholder }), voice.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.voiceNotesLabel, children: voice.map((v, i) => (_jsxs("li", { className: "sac-item", children: [_jsx("span", { className: "sac-item-name", children: S.voiceNote(i + 1, lengthWords(v.ms)) }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${S.voiceNote(i + 1, lengthWords(v.ms))}`, onClick: () => void removeVoice(v), children: S.remove })] }, v.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.showItLegend }), _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "button", className: "sac-button", onClick: () => fileInput.current?.click(), children: S.addImages }), _jsx("button", { type: "button", className: "sac-button", onClick: () => videoInput.current?.click(), children: S.addVideo }), adapters.snapshot ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void takeScreenshot(), children: S.takeScreenshot }) : null] }), _jsx("input", { ref: fileInput, type: "file", accept: "image/*", multiple: true, hidden: true, "aria-label": S.addImages, "data-sac-images": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'image'); } }), _jsx("input", { ref: videoInput, type: "file", accept: "video/*", hidden: true, "aria-label": S.addVideo, "data-sac-video": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'video'); } }), media.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: media.map((m) => (_jsxs("li", { className: "sac-item", children: [_jsxs("span", { className: "sac-item-name", children: [m.name, ", ", sizeWords(m.bytes)] }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${m.name}`, onClick: () => void removeMedia(m), children: S.remove })] }, m.key))) })) : null] }), _jsx("p", { className: "sac-muted sac-fyi", "data-sac-summary": "", children: summary }), error ? _jsx("p", { role: "alert", className: "sac-error", children: error }) : null, _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "submit", className: "sac-button sac-primary", disabled: !hasAnything, "aria-describedby": hasAnything ? undefined : `${titleId}-hint`, children: S.send }), hasAnything ? null : _jsx("span", { id: `${titleId}-hint`, className: "sac-muted", children: S.sendHint })] })] })), _jsx(Toasts, {})] }) }));
 }

package/dist/server/handlers.js

@@ -10,6 +10,7 @@
 import { END, FLOW, STATUSES, TOLD, isAcceptedMedia, isReportId, mayMove, meaningFor, validateReport, wordsFor } from '../contract.mjs';
 import { effectiveLimits } from './rate.js';
 import { ACCEPTED_TYPES, canonicalType, sameType } from './sniff.js';
+import { json, notFound, signIn, cappedText } from './http.js';
 /** What a collector saw of a report: its verified files and its follow-ups. A store computes this from its own copy,
  *  inside `settle`, and settles only when it equals what the collector says it collected. */
 export function reportRevision(r) {
@@ -35,40 +36,17 @@ export const INCOMPLETE_GRACE_MS = 60 * 60_000;
 const FILE = /^[A-Za-z0-9][A-Za-z0-9._-]{0,99}$/;
 const FOLLOW = /^[A-Za-z0-9_-]{1,64}$/;
 const FORBIDDEN = ['timeline', 'status', 'plan', 'decision', 'files', 'receivedAt', 'followUps', 'claimedBy', 'settledBy'];
-const json = (status, body) => new Response(JSON.stringify(body), { status, headers: { 'content-type': 'application/json', 'cache-control': 'no-store' } });
-const notFound = () => json(404, { error: 'not found' });
-const signIn = () => json(401, { error: 'sign in first' });
 const bad = (error) => json(400, { error });
 const isObj = (v) => !!v && typeof v === 'object' && !Array.isArray(v);
 /** Reads a JSON object body, refusing past `BODY_CAP` by the header and again by counting what arrives. */
 async function readBody(req, cap = BODY_CAP, optional = false) {
-    const declared = Number(req.headers.get('content-length'));
-    if (Number.isFinite(declared) && declared > cap)
-        return { res: json(413, { error: 'too large' }) };
-    if (!req.body)
+    if (!req.body && !(Number(req.headers.get('content-length')) > cap))
         return optional ? { body: {} } : { res: bad('a JSON body is needed') };
-    const reader = req.body.getReader();
-    const chunks = [];
-    let n = 0;
-    for (;;) {
-        const { done, value } = await reader.read();
-        if (done)
-            break;
-        n += value.byteLength;
-        if (n > cap) {
-            await reader.cancel().catch(() => { });
-            return { res: json(413, { error: 'too large' }) };
-        }
-        chunks.push(value);
-    }
-    const all = new Uint8Array(n);
-    let o = 0;
-    for (const c of chunks) {
-        all.set(c, o);
-        o += c.byteLength;
-    }
+    const text = await cappedText(req, cap);
+    if (typeof text !== 'string')
+        return { res: text };
     try {
-        const v = JSON.parse(new TextDecoder().decode(all));
+        const v = JSON.parse(text);
         return isObj(v) ? { body: v } : optional ? { body: {} } : { res: bad('a JSON object is needed') };
     }
     catch {

package/dist/server/http.d.ts

@@ -0,0 +1,10 @@
+/** A JSON response that is never cached. */
+export declare const json: (status: number, body: unknown) => Response;
+/** 401, the module's answer to a caller it does not know. */
+export declare const signIn: () => Response;
+/** 404, the module's answer to a report that is gone or not the caller's (the two are never told apart). */
+export declare const notFound: () => Response;
+/** The body as text, or a 413 once it passes `cap` bytes: by its declared length, and again by counting what arrives. A request with no body reads as ''. */
+export declare function cappedText(req: Request, cap: number): Promise<string | Response>;
+/** A JSON object out of text, or an empty one: the module judges the body itself; a wrapper only peeks at a field. */
+export declare function peek(text: string): Record<string, unknown>;

package/dist/server/http.js

@@ -0,0 +1,49 @@
+// The door, in the module's own words: the answers the handlers give for "who are you" and "no such report", a body
+// read that stops at a cap, and a peek at one field. Exported so an app's own route wrapper (one that has to check a
+// caller, or read a field, before the module sees the request) answers exactly as the module does and never reads a
+// body past the cap. Web-standard APIs only.
+/** A JSON response that is never cached. */
+export const json = (status, body) => new Response(JSON.stringify(body), { status, headers: { 'content-type': 'application/json', 'cache-control': 'no-store' } });
+/** 401, the module's answer to a caller it does not know. */
+export const signIn = () => json(401, { error: 'sign in first' });
+/** 404, the module's answer to a report that is gone or not the caller's (the two are never told apart). */
+export const notFound = () => json(404, { error: 'not found' });
+/** The body as text, or a 413 once it passes `cap` bytes: by its declared length, and again by counting what arrives. A request with no body reads as ''. */
+export async function cappedText(req, cap) {
+    const declared = Number(req.headers.get('content-length'));
+    if (Number.isFinite(declared) && declared > cap)
+        return json(413, { error: 'too large' });
+    if (!req.body)
+        return '';
+    const reader = req.body.getReader();
+    const chunks = [];
+    let n = 0;
+    for (;;) {
+        const { done, value } = await reader.read();
+        if (done)
+            break;
+        n += value.byteLength;
+        if (n > cap) {
+            await reader.cancel().catch(() => { });
+            return json(413, { error: 'too large' });
+        }
+        chunks.push(value);
+    }
+    const all = new Uint8Array(n);
+    let o = 0;
+    for (const c of chunks) {
+        all.set(c, o);
+        o += c.byteLength;
+    }
+    return new TextDecoder().decode(all);
+}
+/** A JSON object out of text, or an empty one: the module judges the body itself; a wrapper only peeks at a field. */
+export function peek(text) {
+    try {
+        const v = JSON.parse(text);
+        return v && typeof v === 'object' && !Array.isArray(v) ? v : {};
+    }
+    catch {
+        return {};
+    }
+}

package/dist/server/index.d.ts

@@ -1,5 +1,6 @@
 export { createReportHandlers, reportRevision, TOLD, VOICE_BYTES_PER_SECOND, LEASE_MS, BODY_CAP, APPROVAL_LEASE_MS, HELD_MS, READ_TTL_MS, INCOMPLETE_GRACE_MS, VOICE_FILE_BYTES } from './handlers.ts';
 export type { HostedStore, StoredReport, TimelineEntry, FileState, FollowUp, TellEvent, SubmitterNews, ReportHandlerOptions } from './handlers.ts';
+export { json, signIn, notFound, cappedText, peek } from './http.ts';
 export { sniffType, sameType, canonicalType, ACCEPTED_TYPES } from './sniff.ts';
 export { effectiveLimits } from './rate.ts';
 export type { Limits } from './rate.ts';

package/dist/server/index.js

@@ -1,5 +1,6 @@
 // "@supersuit/suggest-a-change/server": web-standard APIs only, no runtime dependency, nothing from react or the client.
 export { createReportHandlers, reportRevision, TOLD, VOICE_BYTES_PER_SECOND, LEASE_MS, BODY_CAP, APPROVAL_LEASE_MS, HELD_MS, READ_TTL_MS, INCOMPLETE_GRACE_MS, VOICE_FILE_BYTES } from './handlers.js';
+export { json, signIn, notFound, cappedText, peek } from './http.js';
 export { sniffType, sameType, canonicalType, ACCEPTED_TYPES } from './sniff.js';
 export { effectiveLimits } from './rate.js';
 export { runStoreConformance, checks as conformanceChecks } from './conformance.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supersuit/suggest-a-change",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "The report format and flow behind a Suggest a change button: what a report is, who acts at each step, the screens, and the check every app runs. The contract has zero dependencies.",
   "type": "module",
   "bin": {

package/src/client/sheet.tsx

@@ -75,8 +75,6 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
   const [answers, setAnswers] = useState<Answers>({ ...NO_ANSWERS, happened: initial?.happened ?? '' })
   const [voice, setVoice] = useState<Voice[]>([])
   const [media, setMedia] = useState<Media[]>([])
-  // The design's example line is the default: version, screen name (always) and phone type. The time and the screen size are opt-in.
-  const [on, setOn] = useState<Record<Diag, boolean>>({ appVersion: true, at: false, screen: false, device: true })
   const [error, setError] = useState('')
   const [announce, setAnnounce] = useState('')
   const [sent, setSent] = useState<{ id: string; files: { file: string; name: string; bytes: number }[] } | null>(null)
@@ -251,17 +249,16 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
     setAnnounce(S.voiceNoteRemoved)
   }
 
-  // What goes with it: exactly the contract's four diagnostics, each with a switch that really removes it.
-  // Where the person was (the screen's name and address) is what the report is about, so it is always sent and shown as such.
+  // What goes with it: the contract's four diagnostics, always sent, with no switches. Whoever reads the report
+  // needs the device, the time and the screen to act on it, so leaving one out only ever cost a round trip.
+  // The sheet says so in one small FYI line rather than a section to configure.
   const avail = ([
     { name: 'appVersion', label: S.diagAppVersion, value: adapters.about?.version },
     { name: 'at', label: S.diagAt, value: new Date(adapters.phone?.now?.() ?? Date.now()).toISOString() },
     { name: 'screen', label: S.diagScreen, value: screenSize() },
     { name: 'device', label: S.diagDevice, value: adapters.device ? adapters.device() : phoneType() },
   ] as { name: Diag; label: string; value: string | undefined }[]).filter((d): d is { name: Diag; label: string; value: string } => Boolean(d.value))
-  // The design's order: the app's version, this screen's name (always), then whatever else is on, phone type last.
-  const isOn = (n: Diag) => avail.find((d) => d.name === n && on[d.name])?.label
-  const lineParts = [isOn('appVersion'), S.screenName, isOn('at'), isOn('screen'), isOn('device')].filter((x): x is string => Boolean(x))
+  const lineParts = [`this screen (${where.screen}, ${sanitizeRoute(where.route)})`, ...avail.map((d) => d.label)]
   const summary = `${S.goesTo(adapters.words.owner)} ${S.includes(lineParts)}`
 
   // Answers to the broken questions only count while the kind is broken: they are not sent otherwise.
@@ -273,7 +270,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
     await chain.current
     const d = await saveDraft(rt.store, key, { kind, words, attachments: [...voice.map((v) => v.key), ...media.map((m) => m.key)] })
     const diagnostics: Record<string, string> = {}
-    for (const x of avail) if (on[x.name]) diagnostics[x.name] = x.value
+    for (const x of avail) diagnostics[x.name] = x.value
     const report: Record<string, unknown> & { id: string } = {
       id: d.reportId,
       kind,
@@ -411,17 +408,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
               ) : null}
             </fieldset>
 
-            <fieldset className="sac-group">
-              <legend>{S.withLegend}</legend>
-              <p className="sac-summary" data-sac-summary="" aria-live="polite">{summary}</p>
-              <p className="sac-muted" data-sac-where="">{S.alwaysSent(where.screen, sanitizeRoute(where.route))}</p>
-              {avail.map((d) => (
-                <label key={d.name} className="sac-switch">
-                  <input type="checkbox" role="switch" checked={on[d.name]} aria-label={S.include(d.label)} onChange={(e) => setOn((cur) => ({ ...cur, [d.name]: e.target.checked }))} />
-                  <span>{d.label}: <span className="sac-muted">{d.value}</span></span>
-                </label>
-              ))}
-            </fieldset>
+            <p className="sac-muted sac-fyi" data-sac-summary="">{summary}</p>
 
             {error ? <p role="alert" className="sac-error">{error}</p> : null}
             <div className="sac-actions">

package/src/client/styles.css

@@ -49,6 +49,7 @@
 .sac-entry-dot { position: absolute; top: 6px; right: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--sac-accent); box-shadow: 0 0 0 2px var(--sac-bg); }
 .sac-new { align-self: flex-start; font-size: 0.8rem; font-weight: 600; padding: 1px 8px; border-radius: 999px; background: var(--sac-accent); color: var(--sac-accent-fg); }
 .sac-muted { color: var(--sac-muted); font-size: 0.9rem; }
+.sac-fyi { font-size: 0.8rem; margin: 0; }
 .sac-error { color: var(--sac-danger); margin: 0; }
 .sac-receipt-line { font-weight: 600; margin: 0; }
 .sac-strip { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }

package/src/server/handlers.ts

@@ -10,6 +10,7 @@
 import { END, FLOW, STATUSES, TOLD, isAcceptedMedia, isReportId, mayMove, meaningFor, validateReport, wordsFor } from '../contract.mjs'
 import { effectiveLimits, type Limits } from './rate.ts'
 import { ACCEPTED_TYPES, canonicalType, sameType } from './sniff.ts'
+import { json, notFound, signIn, cappedText } from './http.ts'
 
 /** `by` is the actor (contract FLOW). `holder` is the maintainer whose Mac started or ended the work, written on a being-made
  *  or end entry: the approval on such a report never lapses, and it is how the list and the claim name who has it. */
@@ -129,34 +130,17 @@ const FILE = /^[A-Za-z0-9][A-Za-z0-9._-]{0,99}$/
 const FOLLOW = /^[A-Za-z0-9_-]{1,64}$/
 const FORBIDDEN = ['timeline', 'status', 'plan', 'decision', 'files', 'receivedAt', 'followUps', 'claimedBy', 'settledBy']
 
-const json = (status: number, body: unknown): Response =>
-  new Response(JSON.stringify(body), { status, headers: { 'content-type': 'application/json', 'cache-control': 'no-store' } })
-const notFound = () => json(404, { error: 'not found' })
-const signIn = () => json(401, { error: 'sign in first' })
 const bad = (error: string) => json(400, { error })
 const isObj = (v: unknown): v is Record<string, unknown> => !!v && typeof v === 'object' && !Array.isArray(v)
 
 type Body = { body: Record<string, unknown> } | { res: Response }
 /** Reads a JSON object body, refusing past `BODY_CAP` by the header and again by counting what arrives. */
 async function readBody(req: Request, cap = BODY_CAP, optional = false): Promise<Body> {
-  const declared = Number(req.headers.get('content-length'))
-  if (Number.isFinite(declared) && declared > cap) return { res: json(413, { error: 'too large' }) }
-  if (!req.body) return optional ? { body: {} } : { res: bad('a JSON body is needed') }
-  const reader = req.body.getReader()
-  const chunks: Uint8Array[] = []
-  let n = 0
-  for (;;) {
-    const { done, value } = await reader.read()
-    if (done) break
-    n += value.byteLength
-    if (n > cap) { await reader.cancel().catch(() => {}); return { res: json(413, { error: 'too large' }) } }
-    chunks.push(value)
-  }
-  const all = new Uint8Array(n)
-  let o = 0
-  for (const c of chunks) { all.set(c, o); o += c.byteLength }
+  if (!req.body && !(Number(req.headers.get('content-length')) > cap)) return optional ? { body: {} } : { res: bad('a JSON body is needed') }
+  const text = await cappedText(req, cap)
+  if (typeof text !== 'string') return { res: text }
   try {
-    const v = JSON.parse(new TextDecoder().decode(all))
+    const v = JSON.parse(text)
     return isObj(v) ? { body: v } : optional ? { body: {} } : { res: bad('a JSON object is needed') }
   } catch { return optional ? { body: {} } : { res: bad('the body is not JSON') } }
 }

package/src/server/http.ts

@@ -0,0 +1,38 @@
+// The door, in the module's own words: the answers the handlers give for "who are you" and "no such report", a body
+// read that stops at a cap, and a peek at one field. Exported so an app's own route wrapper (one that has to check a
+// caller, or read a field, before the module sees the request) answers exactly as the module does and never reads a
+// body past the cap. Web-standard APIs only.
+
+/** A JSON response that is never cached. */
+export const json = (status: number, body: unknown): Response =>
+  new Response(JSON.stringify(body), { status, headers: { 'content-type': 'application/json', 'cache-control': 'no-store' } })
+/** 401, the module's answer to a caller it does not know. */
+export const signIn = (): Response => json(401, { error: 'sign in first' })
+/** 404, the module's answer to a report that is gone or not the caller's (the two are never told apart). */
+export const notFound = (): Response => json(404, { error: 'not found' })
+
+/** The body as text, or a 413 once it passes `cap` bytes: by its declared length, and again by counting what arrives. A request with no body reads as ''. */
+export async function cappedText(req: Request, cap: number): Promise<string | Response> {
+  const declared = Number(req.headers.get('content-length'))
+  if (Number.isFinite(declared) && declared > cap) return json(413, { error: 'too large' })
+  if (!req.body) return ''
+  const reader = req.body.getReader()
+  const chunks: Uint8Array[] = []
+  let n = 0
+  for (;;) {
+    const { done, value } = await reader.read()
+    if (done) break
+    n += value.byteLength
+    if (n > cap) { await reader.cancel().catch(() => {}); return json(413, { error: 'too large' }) }
+    chunks.push(value)
+  }
+  const all = new Uint8Array(n)
+  let o = 0
+  for (const c of chunks) { all.set(c, o); o += c.byteLength }
+  return new TextDecoder().decode(all)
+}
+
+/** A JSON object out of text, or an empty one: the module judges the body itself; a wrapper only peeks at a field. */
+export function peek(text: string): Record<string, unknown> {
+  try { const v = JSON.parse(text) as unknown; return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : {} } catch { return {} }
+}

package/src/server/index.ts

@@ -1,6 +1,7 @@
 // "@supersuit/suggest-a-change/server": web-standard APIs only, no runtime dependency, nothing from react or the client.
 export { createReportHandlers, reportRevision, TOLD, VOICE_BYTES_PER_SECOND, LEASE_MS, BODY_CAP, APPROVAL_LEASE_MS, HELD_MS, READ_TTL_MS, INCOMPLETE_GRACE_MS, VOICE_FILE_BYTES } from './handlers.ts'
 export type { HostedStore, StoredReport, TimelineEntry, FileState, FollowUp, TellEvent, SubmitterNews, ReportHandlerOptions } from './handlers.ts'
+export { json, signIn, notFound, cappedText, peek } from './http.ts'
 export { sniffType, sameType, canonicalType, ACCEPTED_TYPES } from './sniff.ts'
 export { effectiveLimits } from './rate.ts'
 export type { Limits } from './rate.ts'