@gjermundgaraba-designs/pixel-paper 0.20.1 → 0.22.0

package/dist/src/rows/rows.d.ts

@@ -47,7 +47,8 @@ export type TreegridPlace = Readonly<{
 export type RowConfig<Message> = Readonly<{
     /** The row's stable id among its siblings. */
     key: string;
-    /** The 18px glyph slot at the left: a `glyphView`, or a `toggleView`. */
+    /** The 18px glyph slot at the left: a `glyphView`, a `toggleView`, or a status as a
+     *  `Chip.dotView`. */
     glyph?: Html;
     /** The row's text; it takes the free width and ellipsises. */
     body: ReadonlyArray<Html | string>;
@@ -68,6 +69,13 @@ export type RowConfig<Message> = Readonly<{
      *  after its text for screen readers, which the muting does not reach. In a selectable
      *  row the text names the box, so the box's name says it too. */
     isContext?: boolean;
+    /** The row's text holds one link (a task, a page), and the row's whole box is its target: a
+     *  press anywhere on the row follows it, while the row's own controls (the box, a toggle,
+     *  the actions and tools) and whatever has a tip stay their own targets. The row takes no
+     *  Tab stop of its own, and the link's ring is drawn round the row. A link that is
+     *  `aria-current` inverts the row. For a list no keyboard drives: a treegrid's row (with
+     *  `treegrid`) is already its own stop, and ignores it. */
+    isLink?: boolean;
     /** Makes the row selectable: a box at its left edge. */
     select?: RowSelect<Message>;
     /** The row's place in a treegrid; every row of a treegrid has one. */

package/dist/src/rows/rows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rows.d.ts","sourceRoot":"","sources":["../../../src/rows/rows.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"rows.d.ts","sourceRoot":"","sources":["../../../src/rows/rows.ts"],"names":[],"mappings":"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"}

package/dist/src/rows/rows.js

@@ -29,7 +29,7 @@ const textOf = (config, h) => __foldkitBrandViewResult((config.isContext === tru
 const lineView = (config, box, text, h) => __foldkitBrandViewResult((h.div([
     ...(config.attributes ?? []),
     ...rowRole(config.treegrid, h),
-    h.Class(config.isContext === true ? "row context" : "row"),
+    h.Class(`row${config.isContext === true ? " context" : ""}${config.isLink === true && config.treegrid === undefined ? " linked" : ""}`),
 ], [
     ...box,
     ...cellView(config, "cell", config.glyph === undefined ? [] : [config.glyph], h),

package/dist/src/sortable/sortable.d.ts

@@ -245,8 +245,6 @@ export declare const update: (model: Model, message: Message) => Readonly<{
         }>;
     };
     commands?: Update.Commands<{
-        readonly _tag: "PressedEscape";
-    } | {
         readonly _tag: "CancelledPointer";
     } | {
         readonly _tag: "CompletedAnnounceReorder";
@@ -255,9 +253,6 @@ export declare const update: (model: Model, message: Message) => Readonly<{
     } | {
         readonly _tag: "GotDragAndDropMessage";
         readonly message: {
-            readonly _tag: "PressedArrowKey";
-            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-        } | {
             readonly _tag: "ActivatedKeyboardDrag";
             readonly itemId: string;
             readonly containerId: string;
@@ -284,6 +279,9 @@ export declare const update: (model: Model, message: Message) => Readonly<{
                 readonly containerId: string;
                 readonly index: number;
             }>;
+        } | {
+            readonly _tag: "PressedArrowKey";
+            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
         } | {
             readonly _tag: "PressedDraggable";
             readonly itemId: string;
@@ -301,6 +299,8 @@ export declare const update: (model: Model, message: Message) => Readonly<{
         readonly clientX: number;
         readonly clientY: number;
         readonly maybeIndex: Option.Option<number>;
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "PressedGripKey";
         readonly itemId: string;
@@ -413,8 +413,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
             }>;
         }>;
     }, {
-        readonly _tag: "PressedEscape";
-    } | {
         readonly _tag: "CancelledPointer";
     } | {
         readonly _tag: "CompletedAnnounceReorder";
@@ -423,9 +421,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
     } | {
         readonly _tag: "GotDragAndDropMessage";
         readonly message: {
-            readonly _tag: "PressedArrowKey";
-            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-        } | {
             readonly _tag: "ActivatedKeyboardDrag";
             readonly itemId: string;
             readonly containerId: string;
@@ -452,6 +447,9 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
                 readonly containerId: string;
                 readonly index: number;
             }>;
+        } | {
+            readonly _tag: "PressedArrowKey";
+            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
         } | {
             readonly _tag: "PressedDraggable";
             readonly itemId: string;
@@ -469,6 +467,8 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
         readonly clientX: number;
         readonly clientY: number;
         readonly maybeIndex: Option.Option<number>;
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "PressedGripKey";
         readonly itemId: string;
@@ -559,8 +559,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
             }>;
         }>;
     }, {
-        readonly _tag: "PressedEscape";
-    } | {
         readonly _tag: "CancelledPointer";
     } | {
         readonly _tag: "CompletedAnnounceReorder";
@@ -569,9 +567,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
     } | {
         readonly _tag: "GotDragAndDropMessage";
         readonly message: {
-            readonly _tag: "PressedArrowKey";
-            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-        } | {
             readonly _tag: "ActivatedKeyboardDrag";
             readonly itemId: string;
             readonly containerId: string;
@@ -598,6 +593,9 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
                 readonly containerId: string;
                 readonly index: number;
             }>;
+        } | {
+            readonly _tag: "PressedArrowKey";
+            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
         } | {
             readonly _tag: "PressedDraggable";
             readonly itemId: string;
@@ -615,6 +613,8 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
         readonly clientX: number;
         readonly clientY: number;
         readonly maybeIndex: Option.Option<number>;
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "PressedGripKey";
         readonly itemId: string;
@@ -710,8 +710,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
             }>;
         }>;
     }, {
-        readonly _tag: "PressedEscape";
-    } | {
         readonly _tag: "CancelledPointer";
     } | {
         readonly _tag: "CompletedAnnounceReorder";
@@ -720,9 +718,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
     } | {
         readonly _tag: "GotDragAndDropMessage";
         readonly message: {
-            readonly _tag: "PressedArrowKey";
-            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-        } | {
             readonly _tag: "ActivatedKeyboardDrag";
             readonly itemId: string;
             readonly containerId: string;
@@ -749,6 +744,9 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
                 readonly containerId: string;
                 readonly index: number;
             }>;
+        } | {
+            readonly _tag: "PressedArrowKey";
+            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
         } | {
             readonly _tag: "PressedDraggable";
             readonly itemId: string;
@@ -766,6 +764,8 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
         readonly clientX: number;
         readonly clientY: number;
         readonly maybeIndex: Option.Option<number>;
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "PressedGripKey";
         readonly itemId: string;
@@ -857,8 +857,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
             }>;
         }>;
     }, {
-        readonly _tag: "PressedEscape";
-    } | {
         readonly _tag: "CancelledPointer";
     } | {
         readonly _tag: "CompletedAnnounceReorder";
@@ -867,9 +865,6 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
     } | {
         readonly _tag: "GotDragAndDropMessage";
         readonly message: {
-            readonly _tag: "PressedArrowKey";
-            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-        } | {
             readonly _tag: "ActivatedKeyboardDrag";
             readonly itemId: string;
             readonly containerId: string;
@@ -896,6 +891,9 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
                 readonly containerId: string;
                 readonly index: number;
             }>;
+        } | {
+            readonly _tag: "PressedArrowKey";
+            readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
         } | {
             readonly _tag: "PressedDraggable";
             readonly itemId: string;
@@ -913,6 +911,8 @@ export declare const subscriptions: <Prefix extends string>(keyPrefix: Prefix) =
         readonly clientX: number;
         readonly clientY: number;
         readonly maybeIndex: Option.Option<number>;
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "PressedGripKey";
         readonly itemId: string;
@@ -1055,8 +1055,6 @@ export declare const view: import("foldkit/submodel").View<{
         }>;
     }>;
 }, {
-    readonly _tag: "PressedEscape";
-} | {
     readonly _tag: "CancelledPointer";
 } | {
     readonly _tag: "CompletedAnnounceReorder";
@@ -1065,9 +1063,6 @@ export declare const view: import("foldkit/submodel").View<{
 } | {
     readonly _tag: "GotDragAndDropMessage";
     readonly message: {
-        readonly _tag: "PressedArrowKey";
-        readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
-    } | {
         readonly _tag: "ActivatedKeyboardDrag";
         readonly itemId: string;
         readonly containerId: string;
@@ -1094,6 +1089,9 @@ export declare const view: import("foldkit/submodel").View<{
             readonly containerId: string;
             readonly index: number;
         }>;
+    } | {
+        readonly _tag: "PressedArrowKey";
+        readonly direction: "Down" | "Left" | "NextContainer" | "PreviousContainer" | "Right" | "Up";
     } | {
         readonly _tag: "PressedDraggable";
         readonly itemId: string;
@@ -1111,6 +1109,8 @@ export declare const view: import("foldkit/submodel").View<{
     readonly clientX: number;
     readonly clientY: number;
     readonly maybeIndex: Option.Option<number>;
+} | {
+    readonly _tag: "PressedEscape";
 } | {
     readonly _tag: "PressedGripKey";
     readonly itemId: string;

package/dist/src/toast/toast.d.ts

@@ -326,6 +326,8 @@ export declare const update: (model: Model, message: Message) => Readonly<{
                 readonly pendingDismissVersion: number;
                 readonly isHovered: boolean;
                 readonly swipeState: {
+                    readonly _tag: "Idle";
+                } | {
                     readonly _tag: "Dismissing";
                     readonly offsetX: number;
                     readonly direction: "Left" | "Right";
@@ -334,8 +336,6 @@ export declare const update: (model: Model, message: Message) => Readonly<{
                     readonly pointerId: number;
                     readonly startX: number;
                     readonly currentX: number;
-                } | {
-                    readonly _tag: "Idle";
                 } | {
                     readonly _tag: "Settling";
                     readonly offsetX: number;
@@ -371,15 +371,15 @@ export declare const update: (model: Model, message: Message) => Readonly<{
             readonly _tag: "GotAnimationMessage";
             readonly entryId: string;
             readonly message: {
+                readonly _tag: "Hid";
+            } | {
+                readonly _tag: "Showed";
+            } | {
                 readonly _tag: "CompletedWaitForPaint";
                 readonly generation: number;
             } | {
                 readonly _tag: "EndedAnimation";
                 readonly generation: number;
-            } | {
-                readonly _tag: "Hid";
-            } | {
-                readonly _tag: "Showed";
             };
         } | {
             readonly _tag: "HoveredEntry";
@@ -557,6 +557,8 @@ export declare const view: import("foldkit/submodel").View<{
             readonly pendingDismissVersion: number;
             readonly isHovered: boolean;
             readonly swipeState: {
+                readonly _tag: "Idle";
+            } | {
                 readonly _tag: "Dismissing";
                 readonly offsetX: number;
                 readonly direction: "Left" | "Right";
@@ -565,8 +567,6 @@ export declare const view: import("foldkit/submodel").View<{
                 readonly pointerId: number;
                 readonly startX: number;
                 readonly currentX: number;
-            } | {
-                readonly _tag: "Idle";
             } | {
                 readonly _tag: "Settling";
                 readonly offsetX: number;
@@ -602,15 +602,15 @@ export declare const view: import("foldkit/submodel").View<{
         readonly _tag: "GotAnimationMessage";
         readonly entryId: string;
         readonly message: {
+            readonly _tag: "Hid";
+        } | {
+            readonly _tag: "Showed";
+        } | {
             readonly _tag: "CompletedWaitForPaint";
             readonly generation: number;
         } | {
             readonly _tag: "EndedAnimation";
             readonly generation: number;
-        } | {
-            readonly _tag: "Hid";
-        } | {
-            readonly _tag: "Showed";
         };
     } | {
         readonly _tag: "HoveredEntry";

package/dist/src/window/window.d.ts

@@ -12,7 +12,9 @@ export type ViewConfig<Message> = Readonly<{
     glyph?: GlyphName;
     /** A chip in the title bar: its state. */
     status?: ReadonlyArray<Html | string>;
-    /** IconButtons in the title bar, before the close. */
+    /** IconButtons in the title bar, before the close. A child Submodel, whose view is one
+     *  `Html`, hands back several in a `span.window-tools`: it is no box of its own
+     *  (`display: contents`), so its buttons sit in the bar as the others do. */
     tools?: ReadonlyArray<Html>;
     /** The close glyph's Message; the glyph prints when it is given. */
     onClose?: Message;

package/dist/src/window/window.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/window/window.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAOpD,wDAAwD;AACxD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,oFAAoF;IACpF,EAAE,EAAE,MAAM,CAAC;IACX,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC3B,+DAA+D;IAC/D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0CAA0C;IAC1C,MAAM,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACtC,sDAAsD;IACtD,KAAK,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5B,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC,iEAAiE;IACjE,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC,8DAA8D;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC,CAAC;AAEH;;6DAE6D;AAC7D,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IAsCpF,CAAC"}
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/window/window.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAOpD,wDAAwD;AACxD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,oFAAoF;IACpF,EAAE,EAAE,MAAM,CAAC;IACX,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC3B,+DAA+D;IAC/D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0CAA0C;IAC1C,MAAM,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACtC;;iFAE6E;IAC7E,KAAK,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5B,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC,iEAAiE;IACjE,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC,8DAA8D;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC,CAAC;AAEH;;6DAE6D;AAC7D,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IAsCpF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gjermundgaraba-designs/pixel-paper",
-  "version": "0.20.1",
+  "version": "0.22.0",
   "license": "MIT",
   "repository": {
     "type": "git",

package/src/bench/bench.ts

@@ -0,0 +1,24 @@
+import type { Html, HtmlBuilder } from "foldkit/html";
+
+// VIEW
+
+/** Configuration for rendering a bench with `view`. */
+export type ViewConfig = Readonly<{
+  /** Above the work, at its own height: a PageHead, notices, and a Rail's open button first. */
+  head: ReadonlyArray<Html | string>;
+  /** The work, taking the rest of the window's height: a Reel, which fills it. */
+  body: ReadonlyArray<Html | string>;
+}>;
+
+/** A page whose work is the window: its head at its own height, then the work in all the
+ *  height left, from under the top bar to the window's bottom and edge to edge (beside a Rail,
+ *  from the rail's edge). The main landmark (`<main id="main">`). The page does not scroll;
+ *  the work scrolls itself where it must (a reel's columns, sideways). */
+export const view = <Message>(config: ViewConfig, h: HtmlBuilder<Message>): Html => {
+  const { head, body } = config;
+
+  return h.main(
+    [h.Id("main"), h.Class("bench")],
+    [h.div([h.Class("bench-head")], head), h.div([h.Class("bench-work")], body)],
+  );
+};

package/src/bench/index.ts

@@ -0,0 +1,2 @@
+export { view } from "./bench.ts";
+export type { ViewConfig } from "./bench.ts";

package/src/chip/chip.ts

@@ -37,3 +37,34 @@ export const view = <Message>(config: ViewConfig, h: HtmlBuilder<Message>): Html
     [label, ...(isBusy ? [h.span([h.Class("cursor"), h.AriaHidden(true)])] : [])],
   );
 };
+
+// DOT
+
+/** Configuration for rendering a dot with `dotView`. */
+export type DotConfig = Readonly<{
+  /** The state word: the dot's accessible name and its tip. */
+  label: string;
+  tone?: Tone;
+}>;
+
+const DOT_CLASS: Readonly<Record<Tone, string>> = {
+  Plain: "chip-dot",
+  Go: "chip-dot go",
+  Warn: "chip-dot warn",
+  Blocked: "chip-dot blocked",
+  Done: "chip-dot done",
+};
+
+/** A chip as a 10px cell in its tone, where a word would take the room a title needs (a task
+ *  row's status, before its title). It is an image (`role="img"`) named by the word, which its
+ *  tip shows, so the state never rests on its colour. */
+export const dotView = <Message>(config: DotConfig, h: HtmlBuilder<Message>): Html => {
+  const { label, tone = "Plain" } = config;
+
+  return h.span([
+    h.Role("img"),
+    h.AriaLabel(label),
+    h.DataAttribute("tip", label),
+    h.Class(DOT_CLASS[tone]),
+  ]);
+};

package/src/chip/index.ts

@@ -1,2 +1,2 @@
-export { view } from "./chip.ts";
-export type { Tone, ViewConfig } from "./chip.ts";
+export { dotView, view } from "./chip.ts";
+export type { DotConfig, Tone, ViewConfig } from "./chip.ts";

package/src/drag/drag.ts

@@ -1,11 +1,15 @@
 // Shared by Board and Sortable, the two users of @foldkit/ui's DragAndDrop, and Reel, which
 // holds its own: the phase a drag is in, the DragAndDrop Messages both build, what a press
 // lifts, Escape taken before anything else, the pressing pointer's events, the lifted copy's
-// measure, and the closest-centre drop target a sortable resolves for a pointer.
+// measure, and the closest-centre drop target a sortable resolves for a pointer. A splitter's
+// handlers are the Reel's and the Rail's.
 
 import { DragAndDrop as UiDragAndDrop } from "@foldkit/ui";
 import { Array, Effect, Option, Order, Stream, pipe } from "effect";
 import * as Dom from "foldkit/dom";
+import type { Attribute, HtmlBuilder } from "foldkit/html";
+
+import { isPlain } from "../keys/keys.ts";
 
 // PHASE
 
@@ -125,6 +129,61 @@ export const pressingPointer = (pointerId: number): Stream.Stream<PointerEvent>
     (event) => event.pointerId === pointerId,
   );
 
+/** What the pressing pointer `pointerId` does, as Messages: each move, the release and the
+ *  browser's cancel. */
+export const pointerMessages = <Message>(
+  pointerId: number,
+  toMessage: Readonly<{
+    moved: (event: PointerEvent) => Message;
+    released: (event: PointerEvent) => Message;
+    cancelled: () => Message;
+  }>,
+): Stream.Stream<Message> =>
+  Stream.map(pressingPointer(pointerId), (event) => {
+    if (event.type === "pointermove") {
+      return toMessage.moved(event);
+    } else if (event.type === "pointerup") {
+      return toMessage.released(event);
+    } else {
+      return toMessage.cancelled();
+    }
+  });
+
+// SPLITTER
+
+/** A splitter's handlers. The main button of a pointer presses it (`onPress`, while
+ *  `isIdle`), and its arrows, unmodified, step it (`onStep`, one way or the other): the side
+ *  arrows across a `"vertical"` splitter (it sizes a width), up and down along a
+ *  `"horizontal"` one (a height). A modified arrow is the application's. */
+export const splitterAttributes = <Message>(
+  config: Readonly<{
+    orientation: "vertical" | "horizontal";
+    isIdle: boolean;
+    onPress: (pointerId: number, clientX: number, clientY: number) => Message;
+    onStep: (direction: -1 | 1) => Message;
+  }>,
+  h: HtmlBuilder<Message>,
+): ReadonlyArray<Attribute<Message>> => {
+  const [less, more] =
+    config.orientation === "vertical" ? ["ArrowLeft", "ArrowRight"] : ["ArrowUp", "ArrowDown"];
+  return [
+    h.AriaOrientation(config.orientation),
+    h.OnPointerDown(
+      (_pointerType, button, _screenX, _screenY, _time, clientX, clientY, pointerId) =>
+        Option.liftPredicate(
+          config.onPress(pointerId, clientX, clientY),
+          () => button === LEFT_BUTTON && config.isIdle,
+        ),
+    ),
+    h.OnKeyDownPreventDefault((key, modifiers) =>
+      Option.liftPredicate(
+        config.onStep(key === more ? 1 : -1),
+        () => isPlain(modifiers) && (key === less || key === more),
+      ),
+    ),
+  ];
+};
+
 // LIFTED COPY
 
 /** Sizes the copy that follows the pointer to the element `sourceSelector` finds, and keeps the

package/src/field/field.ts

@@ -48,6 +48,9 @@ export type ViewConfig<Message> = Readonly<{
   isBoxed?: boolean;
   /** Code and identifiers: the system monospace. */
   isMono?: boolean;
+  /** The label is for screen readers only (`.sr-only`): a field whose place says what it is,
+   *  such as a browser's address bar. It still names the input. */
+  isLabelHidden?: boolean;
   /** The input's type (`"date"` for the browser's date control, always boxed); text when not
    *  given. */
   type?: string;
@@ -71,6 +74,7 @@ export const view = <Message>(config: ViewConfig<Message>, h: HtmlBuilder<Messag
     isRequired = false,
     isBoxed = false,
     isMono = false,
+    isLabelHidden = false,
     type,
     inputAttributes = [],
   } = config;
@@ -87,7 +91,7 @@ export const view = <Message>(config: ViewConfig<Message>, h: HtmlBuilder<Messag
         h.div(
           [h.Class(`field${isBoxed || type === "date" ? " boxed" : ""}${isMono ? " mono" : ""}`)],
           [
-            h.label(groups.label, [label]),
+            h.label([...groups.label, ...(isLabelHidden ? [h.Class("sr-only")] : [])], [label]),
             // NOTE: @foldkit/ui gap: Input has no required option, so the wrapper says it.
             h.input([
               ...inputAttributes,

package/src/index.ts

@@ -2,6 +2,7 @@ export * as Announcer from "./announcer/index.ts";
 export * as AudioFrame from "./audioFrame/index.ts";
 export * as Banner from "./banner/index.ts";
 export * as BarChart from "./barChart/index.ts";
+export * as Bench from "./bench/index.ts";
 export * as Board from "./board/index.ts";
 export * as Button from "./button/index.ts";
 export * as Card from "./card/index.ts";

package/src/lineDiff/index.ts

@@ -1,2 +1,4 @@
 export { patchView, view } from "./lineDiff.ts";
 export type { PatchViewConfig, ViewConfig } from "./lineDiff.ts";
+export { describePatch } from "./patch.ts";
+export type { PatchDescription } from "./patch.ts";

package/src/lineDiff/lineDiff.ts

@@ -1,15 +1,9 @@
-import { Array, Option, String } from "effect";
+import { Array, Option } from "effect";
 import type { Html, HtmlBuilder } from "foldkit/html";
 
 import { LOCALE } from "../locale/locale.ts";
-import {
-  DiffRow,
-  type LineKind,
-  diffRowsOf,
-  diffRowsOfPatch,
-  foldUnchanged,
-  hasChanges,
-} from "./diff.ts";
+import { DiffRow, type LineKind, diffRowsOf, foldUnchanged, hasChanges } from "./diff.ts";
+import { SAME_NOTE, readPatch } from "./patch.ts";
 
 // VIEW
 
@@ -29,7 +23,8 @@ export type ViewConfig = Readonly<{
 
 /** Configuration for rendering a unified diff with `patchView`. */
 export type PatchViewConfig = Readonly<{
-  /** One file's unified diff, as `diff -u` or `git diff -- <path>` writes it. */
+  /** One file's unified diff, as `diff -u` or `git diff -- <path>` writes it, its git header
+   *  included. */
   patch: string;
   /** Names the two sides for screen readers: `"Version 3 against version 4"`. */
   label: string;
@@ -86,8 +81,6 @@ const rowView = <Message>(row: DiffRow, h: HtmlBuilder<Message>): Html =>
 const noteView = <Message>(note: string, h: HtmlBuilder<Message>): Html =>
   h.p([h.Class("note-line")], [note]);
 
-const SAME_NOTE = "No difference: both sides hold the same text.";
-
 const tableView = <Message>(
   rows: ReadonlyArray<DiffRow>,
   label: string,
@@ -123,18 +116,30 @@ export const view = <Message>(config: ViewConfig, h: HtmlBuilder<Message>): Html
 /** A unified diff the caller already has (from a server, or `git diff -- <path>`) as `view`'s
  *  table: its hunks' lines, numbered from their headers, and the unchanged lines between hunks
  *  folded into a counted row. Lines past the last hunk are not in the patch, so nothing counts
- *  them. An empty patch says there is no difference, as `view` does; anything but one file
- *  with a hunk (text that is not a diff, a binary change, several files) says it cannot be
- *  shown as lines. */
+ *  them. What git's header says beyond the lines prints as a note line above the table, or in
+ *  its place: a rename, a mode change, an empty or binary file (`describePatch` has the
+ *  sentences). A file whose type changed (a file that became a symlink) is two sections, each
+ *  its own table under one note, named for its side (`"<label>, as it was"`). An empty patch
+ *  says there is no difference, as `view` does; text that is not a diff, or holds several
+ *  files, says it cannot be shown as lines. */
 export const patchView = <Message>(config: PatchViewConfig, h: HtmlBuilder<Message>): Html => {
   const { patch, label } = config;
-
-  if (String.isEmpty(String.trim(patch))) {
-    return noteView(SAME_NOTE, h);
-  } else {
-    return Option.match(diffRowsOfPatch(patch), {
-      onNone: () => noteView("This diff cannot be shown as lines.", h),
-      onSome: (rows) => tableView(rows, label, h),
-    });
-  }
+  const { notes, tables } = readPatch(patch);
+  const parts = [
+    ...(Array.isReadonlyArrayNonEmpty(notes) ? [noteView(Array.join(notes, " "), h)] : []),
+    ...Array.map(tables, ({ rows, maybeSide }) =>
+      tableView(
+        rows,
+        Option.match(maybeSide, { onNone: () => label, onSome: (side) => `${label}, ${side}` }),
+        h,
+      ),
+    ),
+  ];
+
+  // a lone table or note is drawn bare, so a flush window's body still meets its table
+  return Array.match(parts, {
+    onEmpty: () => noteView(SAME_NOTE, h),
+    onNonEmpty: ([part, ...others]) =>
+      Array.isArrayEmpty(others) ? part : h.div([h.Class("stack gap-s")], parts),
+  });
 };