@gjermundgaraba-designs/pixel-paper 0.13.0 → 0.14.0

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

@@ -221,7 +221,7 @@ export declare const FocusSlip: Command.CommandDefinitionWithArgs<"FocusSlip", {
  * slip added to a stack already on the page is read from there, and this says nothing more. A
  * stack mounted in the same render (it moved to another host, a Dialog opening or closing in
  * the same update) is a live region that arrives already holding the slip, which goes
- * unheard: then the slip is said through the page's live region (see `Announcer.announce`),
+ * unheard: then the slip is said through the page's live region (as `Announcer.Announce` does),
  * which follows the same host. It compares the stack element before and after the render.
  */
 export declare const AnnounceSlip: Command.CommandDefinitionWithArgs<"AnnounceSlip", {
@@ -286,6 +286,8 @@ export declare const update: (model: Model, message: Message) => Readonly<{
     };
     commands?: Update.Commands<{
         readonly _tag: "CompletedFocus";
+    } | {
+        readonly _tag: "PressedEscape";
     } | {
         readonly _tag: "BlurredStack";
     } | {
@@ -324,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";
@@ -332,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;
@@ -369,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";
@@ -401,8 +403,6 @@ export declare const update: (model: Model, message: Message) => Readonly<{
         };
     } | {
         readonly _tag: "MovedHost";
-    } | {
-        readonly _tag: "PressedEscape";
     }, never>;
     outMessage?: {
         readonly _tag: "SelectedAction";
@@ -442,14 +442,14 @@ export declare const stackFocusOut: (stack: Element, event: FocusEvent) => Optio
 export declare const stackKey: (event: KeyboardEvent) => Option.Option<typeof Message.PressedEscape.Type>;
 /** The stack's focus and keys: focus coming in (and from where) and going out, and Escape
  *  on a slip, which takes the newest and keeps a Dialog the stack sits in open (its default is
- *  prevented). In a Scene, resolve it with `Message.BlurredStack`. */
+ *  prevented). In a Scene, resolve it with `sceneMounts`. */
 export declare const BindStack: Mount.MountDefinitionNoArgs<"BindStack", {
+    readonly _tag: "PressedEscape";
+} | {
     readonly _tag: "BlurredStack";
 } | {
     readonly _tag: "FocusedStack";
     readonly maybeFromId: Option.Option<string>;
-} | {
-    readonly _tag: "PressedEscape";
 }>;
 /**
  * The page's toasts: printed slips at the bottom right (across the bottom on a phone), the
@@ -517,6 +517,8 @@ export declare const view: import("foldkit/submodel").View<{
     readonly maybeReturnFocusId: Option.Option<string>;
 }, {
     readonly _tag: "CompletedFocus";
+} | {
+    readonly _tag: "PressedEscape";
 } | {
     readonly _tag: "BlurredStack";
 } | {
@@ -555,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";
@@ -563,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;
@@ -600,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";
@@ -632,8 +634,18 @@ export declare const view: import("foldkit/submodel").View<{
     };
 } | {
     readonly _tag: "MovedHost";
-} | {
-    readonly _tag: "PressedEscape";
 }, void>;
+/** What a parent's Scene resolves the stack's Mounts with, each with a Message that changes
+ *  nothing: `Scene.Mount.resolveAll(...Toast.sceneMounts)`. */
+export declare const sceneMounts: readonly [readonly [Mount.MountDefinitionNoArgs<"BindStack", {
+    readonly _tag: "PressedEscape";
+} | {
+    readonly _tag: "BlurredStack";
+} | {
+    readonly _tag: "FocusedStack";
+    readonly maybeFromId: Option.Option<string>;
+}>, {
+    readonly _tag: "BlurredStack";
+}]];
 export {};
 //# sourceMappingURL=toast.d.ts.map

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

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

package/dist/src/toast/toast.js

@@ -109,7 +109,7 @@ const stackElement = (stackId) => __foldkitBrandViewResult((Option.fromNullishOr
  * slip added to a stack already on the page is read from there, and this says nothing more. A
  * stack mounted in the same render (it moved to another host, a Dialog opening or closing in
  * the same update) is a live region that arrives already holding the slip, which goes
- * unheard: then the slip is said through the page's live region (see `Announcer.announce`),
+ * unheard: then the slip is said through the page's live region (as `Announcer.Announce` does),
  * which follows the same host. It compares the stack element before and after the render.
  */
 export const AnnounceSlip = Command.define("AnnounceSlip", {
@@ -156,7 +156,9 @@ export const update = (model, message) => __foldkitBrandViewResult((Message.matc
         isFocusIn: () => __foldkitBrandViewResult((true), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#isFocusIn~2"),
         maybeReturnFocusId: (returnId) => (__foldkitBrandViewResult((model.isFocusIn ? returnId : maybeFromId), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#maybeReturnFocusId")),
     }))), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#FocusedStack"),
-    BlurredStack: () => __foldkitBrandViewResult((releaseUnlessHeld(modifyFields(model, { isFocusIn: () => __foldkitBrandViewResult((false), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#isFocusIn~3") }), Option.none())), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#BlurredStack"),
+    BlurredStack: () => __foldkitBrandViewResult((model.isFocusIn
+        ? releaseUnlessHeld(modifyFields(model, { isFocusIn: () => __foldkitBrandViewResult((false), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#isFocusIn~3") }), Option.none())
+        : { model }), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#BlurredStack"),
     PressedEscape: () => __foldkitBrandViewResult((Option.match(Array.last(slips(model)), {
         onNone: () => (__foldkitBrandViewResult(({ model }), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#onNone~3")),
         onSome: (newest) => __foldkitBrandViewResult((dismissKeepingFocus(model, newest.id)), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#onSome~3"),
@@ -246,7 +248,7 @@ export const stackFocusOut = (stack, event) => __foldkitBrandViewResult((Option.
 export const stackKey = (event) => __foldkitBrandViewResult((Option.liftPredicate(Message.PressedEscape(), () => __foldkitBrandViewResult((isEscape(event)), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#anonymous~26"))), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#stackKey");
 /** The stack's focus and keys: focus coming in (and from where) and going out, and Escape
  *  on a slip, which takes the newest and keeps a Dialog the stack sits in open (its default is
- *  prevented). In a Scene, resolve it with `Message.BlurredStack`. */
+ *  prevented). In a Scene, resolve it with `sceneMounts`. */
 export const BindStack = Mount.defineStream("BindStack", {
     messages: [Message.FocusedStack, Message.BlurredStack, Message.PressedEscape],
     execute: ({ element }) => __foldkitBrandViewResult((Stream.mergeAll([
@@ -294,3 +296,6 @@ export const view = defineView((model, h) => __foldkitBrandViewResult((h.div([h.
         toParentMessage: (message) => __foldkitBrandViewResult((Message.GotStackMessage({ message })), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#toParentMessage~2"),
     }),
 ])), "@gjermundgaraba-designs/pixel-paper/src/toast/toast.js#anonymous~27"));
+/** What a parent's Scene resolves the stack's Mounts with, each with a Message that changes
+ *  nothing: `Scene.Mount.resolveAll(...Toast.sceneMounts)`. */
+export const sceneMounts = [[BindStack, Message.BlurredStack()]];

package/dist/src/topBar/barHeight.d.ts

@@ -18,6 +18,12 @@ export declare const MeasureHeight: Mount.MountDefinitionWithArgs<"MeasureHeight
 }, {
     readonly _tag: "CompletedMeasureHeight";
 }>;
+/** What a parent's Scene resolves the bar's Mount with, the Message lifted as the bar's
+ *  `toParentMessage` lifts it: `Scene.Mount.resolveAll(...TopBar.sceneMounts(toParentMessage))`.
+ *  It matches by name, since the Mount the parent holds reports the parent's Message. */
+export declare const sceneMounts: <ParentMessage>(toParentMessage: (message: Message) => ParentMessage) => readonly [readonly [{
+    readonly name: "MeasureHeight";
+}, ParentMessage]];
 /** The bar's measuring attributes, its Mount lifted into the parent's Message. */
 export declare const measureAttributes: <ParentMessage>(toParentMessage: (message: Message) => ParentMessage, args: Readonly<{
     selector: string;

package/dist/src/topBar/barHeight.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"barHeight.d.ts","sourceRoot":"","sources":["../../../src/topBar/barHeight.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,MAAM,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,KAAK,KAAK,MAAM,eAAe,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAI9D;mDACmD;AACnD,eAAO,MAAM,OAAO;;EAAqD,CAAC;AAC1E,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAC;AAO1C;;;uBAGuB;AACvB,eAAO,MAAM,aAAa;;;;;EAyBxB,CAAC;AAEH,kFAAkF;AAClF,eAAO,MAAM,iBAAiB,GAAI,aAAa,mBAC5B,CAAC,OAAO,EAAE,OAAO,KAAK,aAAa,QAC9C,QAAQ,CAAC;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC,KACnD,WAAW,CAAC,aAAa,CAAC,KAC5B,UAAU,CAAC,aAAa,CAAwE,CAAC"}
+{"version":3,"file":"barHeight.d.ts","sourceRoot":"","sources":["../../../src/topBar/barHeight.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,MAAM,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,OAAO,KAAK,KAAK,MAAM,eAAe,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAI9D;mDACmD;AACnD,eAAO,MAAM,OAAO;;EAAqD,CAAC;AAC1E,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAC;AAO1C;;;uBAGuB;AACvB,eAAO,MAAM,aAAa;;;;;EAyBxB,CAAC;AAEH;;yFAEyF;AACzF,eAAO,MAAM,WAAW,GAAI,aAAa,mBAAmB,CAAC,OAAO,EAAE,OAAO,KAAK,aAAa;aACzF,IAAI;kBAAoF,CAAC;AAE/F,kFAAkF;AAClF,eAAO,MAAM,iBAAiB,GAAI,aAAa,mBAC5B,CAAC,OAAO,EAAE,OAAO,KAAK,aAAa,QAC9C,QAAQ,CAAC;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC,KACnD,WAAW,CAAC,aAAa,CAAC,KAC5B,UAAU,CAAC,aAAa,CAAwE,CAAC"}

package/dist/src/topBar/barHeight.js

@@ -33,5 +33,9 @@ export const MeasureHeight = Mount.define("MeasureHeight", {
         return __foldkitBrandViewResult((Message.CompletedMeasureHeight()), "@gjermundgaraba-designs/pixel-paper/src/topBar/barHeight.js#anonymous");
     })), "@gjermundgaraba-designs/pixel-paper/src/topBar/barHeight.js#execute"),
 });
+/** What a parent's Scene resolves the bar's Mount with, the Message lifted as the bar's
+ *  `toParentMessage` lifts it: `Scene.Mount.resolveAll(...TopBar.sceneMounts(toParentMessage))`.
+ *  It matches by name, since the Mount the parent holds reports the parent's Message. */
+export const sceneMounts = (toParentMessage) => __foldkitBrandViewResult(([[{ name: MeasureHeight.name }, toParentMessage(Message.CompletedMeasureHeight())]]), "@gjermundgaraba-designs/pixel-paper/src/topBar/barHeight.js#sceneMounts");
 /** The bar's measuring attributes, its Mount lifted into the parent's Message. */
 export const measureAttributes = (toParentMessage, args, h) => __foldkitBrandViewResult(([h.OnMount(Mount.mapMessage(MeasureHeight(args), toParentMessage))]), "@gjermundgaraba-designs/pixel-paper/src/topBar/barHeight.js#measureAttributes");

package/dist/src/topBar/index.d.ts

@@ -1,4 +1,4 @@
-export { MeasureHeight, Message } from "./barHeight.ts";
+export { MeasureHeight, Message, sceneMounts } from "./barHeight.ts";
 export { view } from "./topBar.ts";
 export type { ViewConfig } from "./topBar.ts";
 //# sourceMappingURL=index.d.ts.map

package/dist/src/topBar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/topBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/topBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC"}

package/dist/src/topBar/index.js

@@ -1,2 +1,2 @@
-export { MeasureHeight, Message } from "./barHeight.js";
+export { MeasureHeight, Message, sceneMounts } from "./barHeight.js";
 export { view } from "./topBar.js";

package/dist/src/topBar/topBar.d.ts

@@ -11,8 +11,7 @@ export type ViewConfig<Message> = Readonly<{
     /** Lifts the bar's lifecycle Message (`MeasureHeight` started: the page's first top bar
      *  keeps `--topbar-h` at its height however it wraps, so anchors land clear of it) into the
      *  parent's Message, which the parent's update takes and changes nothing for. In a Scene,
-     *  resolve the Mount by name with the lifted Message:
-     *  `Scene.Mount.resolve({ name: TopBar.MeasureHeight.name }, toParentMessage(TopBar.Message.CompletedMeasureHeight()))`. */
+     *  resolve it with `TopBar.sceneMounts(toParentMessage)`. */
     toParentMessage: (message: BarHeightMessage) => Message;
 }>;
 /** The sticky paper bar across the top of an interface, closed by a 2px ink rule: the page's

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

@@ -1 +1 @@
-{"version":3,"file":"topBar.d.ts","sourceRoot":"","sources":["../../../src/topBar/topBar.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGtD,OAAO,EAAE,KAAK,OAAO,IAAI,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAIrF,yDAAyD;AACzD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,iCAAiC;IACjC,KAAK,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC,6EAA6E;IAC7E,GAAG,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC1B,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACrC;;;;gIAI4H;IAC5H,eAAe,EAAE,CAAC,OAAO,EAAE,gBAAgB,KAAK,OAAO,CAAC;CACzD,CAAC,CAAC;AAEH;kFACkF;AAClF,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IAUpF,CAAC"}
+{"version":3,"file":"topBar.d.ts","sourceRoot":"","sources":["../../../src/topBar/topBar.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGtD,OAAO,EAAE,KAAK,OAAO,IAAI,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAIrF,yDAAyD;AACzD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,iCAAiC;IACjC,KAAK,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC,6EAA6E;IAC7E,GAAG,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC1B,oDAAoD;IACpD,KAAK,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACrC;;;iEAG6D;IAC7D,eAAe,EAAE,CAAC,OAAO,EAAE,gBAAgB,KAAK,OAAO,CAAC;CACzD,CAAC,CAAC;AAEH;kFACkF;AAClF,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IAUpF,CAAC"}

package/package.json

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

package/src/announcer/announcer.ts

@@ -1,10 +1,24 @@
-import { Array, Duration, Effect, Option, pipe } from "effect";
+import { Array, Duration, Effect, Option, Schema, pipe } from "effect";
+import * as Command from "foldkit/command";
 import type { Html, HtmlBuilder } from "foldkit/html";
+import { defineMessageUnion } from "foldkit/message";
 import * as Render from "foldkit/render";
 
+// MESSAGE
+
+/** What `Announce` and `Flash` report. An application that runs them puts
+ *  `CompletedAnnounce: {}` and `CompletedFlash: {}` in its own Message union, which these tags
+ *  match, and its update changes nothing for them. */
+export const Message = defineMessageUnion({
+  CompletedAnnounce: {},
+  CompletedFlash: {},
+});
+export type Message = typeof Message.Type;
+
 // HOSTING
 
-/** The attribute that marks the page's live region. */
+/** The attribute that marks the page's live region, which a test finds it by: Loading's line
+ *  is a `role="status"` too, so counting that role counts more than the one region. */
 export const ANNOUNCER_ATTRIBUTE = "data-pixel-paper-announcer";
 
 const ANNOUNCER_SELECTOR = `[${ANNOUNCER_ATTRIBUTE}]`;
@@ -12,14 +26,9 @@ const ANNOUNCER_SELECTOR = `[${ANNOUNCER_ATTRIBUTE}]`;
 /**
  * The page's one polite live region, empty until something is said. Render exactly one,
  * placed by the rule every pixel-paper application follows, because an open Dialog makes
- * everything outside it inert and hidden from screen readers:
- *
- * - while a Dialog is open, inside the topmost open one: pass it as that Dialog's
- *   `toLiveRegionView` (ConfirmDialog, KeyHelp and CommandPalette pass theirs through);
- * - otherwise at the end of the body.
- *
- * Decide which from the application's Model (which dialog is open), so the region moves
- * with the dialogs. A Toast stack follows the same rule.
+ * everything outside it inert and hidden from screen readers: inside the topmost open Dialog,
+ * otherwise at the end of the body. `LiveRegion.view` renders it with the toast stack, and
+ * `LiveRegion.place` puts them where the rule says.
  */
 export const view = <Message>(h: HtmlBuilder<Message>): Html =>
   h.div([
@@ -72,22 +81,9 @@ const sayIn = (region: HTMLElement, text: string): Effect.Effect<void> =>
     yield* Effect.sync(() => speak(region));
   });
 
-/**
- * Says `text` to screen readers through the page's live region (see `view`). Words said in
- * the same moment are read together, and the region clears first, so the same words twice
- * are read twice. Without a region on the page it does nothing.
- *
- * Run it from the application's own Command, as Foldkit's `Dom` Effects are run, so its
- * result is the application's Message:
- *
- * ```ts
- * const Announce = Command.define("Announce", {
- *   args: { text: Schema.String },
- *   messages: [Message.CompletedAnnounce],
- *   execute: ({ text }) => Announcer.announce(text).pipe(Effect.as(Message.CompletedAnnounce())),
- * });
- * ```
- */
+/** Says `text` to screen readers through the page's live region, once it has rendered. A
+ *  component that says its own steps (a board's move, a copy) runs it from a Command of its
+ *  own, named for what it says. */
 export const announce = (text: string): Effect.Effect<void> =>
   Effect.gen(function* () {
     yield* Render.afterCommit;
@@ -141,12 +137,7 @@ const runFlash = (element: Element): void => {
   }
 };
 
-/**
- * Inverts the element `selector` finds for one beat (`--motion-flash`): the signal that a
- * change was committed. A second flash mid-beat restarts it. With `prefers-reduced-motion`
- * it holds a still 2px ink ring for the beat instead. Pair it with `announce`, which says
- * what the flash shows, and run it from the application's own Command as `announce` is.
- */
+/** Inverts the element `selector` finds for one beat; `Flash` runs it. */
 export const flash = (selector: string): Effect.Effect<void> =>
   Effect.sync(() => {
     const maybeElement = Option.fromNullishOr(document.querySelector(selector));
@@ -154,3 +145,28 @@ export const flash = (selector: string): Effect.Effect<void> =>
       runFlash(maybeElement.value);
     }
   });
+
+// COMMAND
+
+/**
+ * Says `text` to screen readers through the page's live region (see `view`). Words said in
+ * the same moment are read together, and the region clears first, so the same words twice
+ * are read twice. Without a region on the page it does nothing. Reports `CompletedAnnounce`.
+ */
+export const Announce = Command.define("Announce", {
+  args: { text: Schema.String },
+  messages: [Message.CompletedAnnounce],
+  execute: ({ text }) => announce(text).pipe(Effect.as(Message.CompletedAnnounce())),
+});
+
+/**
+ * Inverts the element `selector` finds for one beat (`--motion-flash`): the signal that a
+ * change was committed. A second flash mid-beat restarts it. With `prefers-reduced-motion`
+ * it holds a still 2px ink ring for the beat instead. Return it beside `Announce`, which says
+ * what the flash shows. Reports `CompletedFlash`.
+ */
+export const Flash = Command.define("Flash", {
+  args: { selector: Schema.String },
+  messages: [Message.CompletedFlash],
+  execute: ({ selector }) => flash(selector).pipe(Effect.as(Message.CompletedFlash())),
+});

package/src/announcer/index.ts

@@ -1 +1 @@
-export { announce, flash, view } from "./announcer.ts";
+export { ANNOUNCER_ATTRIBUTE, Announce, Flash, view } from "./announcer.ts";

package/src/banner/banner.ts

@@ -20,7 +20,7 @@ export type ViewConfig = Readonly<{
  *  interface is in (offline, reconnecting, read-only), for as long as it lasts. One at a
  *  time. It is not a live region, since it arrives already holding its sentence, which would
  *  go unheard: the application says the state once, when it begins, through the page's live
- *  region (`Announcer.announce`, from its own Command). An outcome that comes and goes is a
+ *  region (the `Announcer.Announce` Command). An outcome that comes and goes is a
  *  toast; a word beside the control that did it is a FlashWord. */
 export const view = <Message>(config: ViewConfig, h: HtmlBuilder<Message>): Html => {
   const { body, tone = "Error", actions = [] } = config;

package/src/barChart/barChart.ts

@@ -185,7 +185,7 @@ export const view = <Message>(config: ViewConfig, h: HtmlBuilder<Message>): Html
   const rootAttributes = [h.Class("chart")];
 
   return Array.match(points, {
-    onEmpty: () => EmptyState.view({ title: empty }, h),
+    onEmpty: () => EmptyState.view({ title: empty, headingLevel: "Strong" }, h),
     onNonEmpty: (present) =>
       isRows
         ? h.div(rootAttributes, [

package/src/board/board.ts

@@ -1,7 +1,6 @@
 import { Button as UiButton, DragAndDrop as UiDragAndDrop } from "@foldkit/ui";
 import { Array, Effect, Equal, Match, Option, Schema, Stream, pipe } from "effect";
 import * as Command from "foldkit/command";
-import * as Dom from "foldkit/dom";
 import {
   type Attribute,
   type ChildAttribute,
@@ -24,6 +23,17 @@ import * as IconButton from "../iconButton/iconButton.ts";
 import { LOCALE } from "../locale/locale.ts";
 import { slotView } from "../slot/slot.ts";
 import { prefixKeys } from "../subscription/prefixKeys.ts";
+import {
+  LEFT_BUTTON,
+  activatedKeyboardDrag,
+  cancelledDrag,
+  escapeKeys,
+  innerControls,
+  isCarrying,
+  measureLift,
+  phaseOf,
+  pressedDraggable,
+} from "../drag/drag.ts";
 
 // MODEL
 
@@ -185,32 +195,9 @@ const CARD_ATTRIBUTE = "board-card";
 const TITLE_ATTRIBUTE = "board-title";
 const GRIP_ATTRIBUTE = "board-grip";
 
-// PHASE
-
-const Phase = Schema.Literals(["Idle", "Pressed", "PointerDragging", "KeyboardDragging"]);
-type Phase = typeof Phase.Type;
-
-// NOTE: @foldkit/ui gap: DragAndDrop has no accessor for which input holds a card.
-// `ghostStyle` is Some only while a pointer drags, so it tells a pointer drag from a keyboard
-// one.
-const phaseOf = (dragAndDrop: UiDragAndDrop.Model): Phase => {
-  if (Option.isNone(UiDragAndDrop.maybeDraggedItemId(dragAndDrop))) {
-    return "Idle";
-  } else if (!UiDragAndDrop.isDragging(dragAndDrop)) {
-    return "Pressed";
-  } else if (Option.isSome(UiDragAndDrop.ghostStyle(dragAndDrop))) {
-    return "PointerDragging";
-  } else {
-    return "KeyboardDragging";
-  }
-};
-
-const isCarrying = (phase: Phase): boolean =>
-  phase === "PointerDragging" || phase === "KeyboardDragging";
-
 // COMMAND
 
-/** Says a step of a move through the page's live region (`Announcer.announce`), which is
+/** Says a step of a move through the page's live region (as `Announcer.Announce` does), which is
  *  inside the topmost open dialog when there is one. */
 export const AnnounceMove = Command.define("AnnounceMove", {
   args: { text: Schema.String },
@@ -386,25 +373,6 @@ const settle =
     );
   };
 
-// NOTE: @foldkit/ui gap: DragAndDrop exposes no update capability for a press, a keyboard
-// pick-up or a cancel, and its `draggable` bundle (`role="option"`, `tabindex`) cannot sit on
-// the grip's button, so the board builds these three child Messages itself.
-const pressedDraggable = (
-  fields: Parameters<typeof UiDragAndDrop.Message.PressedDraggable>[0],
-): UiDragAndDrop.Message =>
-  // oxlint-disable-next-line foldkit/no-child-message-construction-in-root
-  UiDragAndDrop.Message.PressedDraggable(fields);
-
-const activatedKeyboardDrag = (
-  fields: Parameters<typeof UiDragAndDrop.Message.ActivatedKeyboardDrag>[0],
-): UiDragAndDrop.Message =>
-  // oxlint-disable-next-line foldkit/no-child-message-construction-in-root
-  UiDragAndDrop.Message.ActivatedKeyboardDrag(fields);
-
-const cancelledDrag = (): UiDragAndDrop.Message =>
-  // oxlint-disable-next-line foldkit/no-child-message-construction-in-root
-  UiDragAndDrop.Message.CancelledDrag();
-
 const holding = (model: Model, held: Held): Model =>
   modifyFields(model, { maybeHeld: () => Option.some(held) });
 
@@ -577,34 +545,13 @@ export const setMovable = (model: Model, isMovable: boolean): UpdateReturn => {
 
 // SUBSCRIPTION
 
-// NOTE: @foldkit/ui gap: DragAndDrop's own Escape cancels the move and lets the key travel
-// on, to a dialog around the board. The board takes the key first and stops it.
-/** Escape while a card is pressed or held cancels it and goes no further: it is taken on the
- *  window, before the page's own key bindings or a dialog see it. */
-export const escapeMessage = (event: KeyboardEvent): Option.Option<Message> => {
-  if (event.key !== "Escape" || event.isComposing) {
-    return Option.none();
-  }
-
-  event.preventDefault();
-  event.stopPropagation();
-  return Option.some(Message.PressedEscape());
-};
-
-const escapeKeys: Stream.Stream<Message> = Dom.streamFromEventFilterMap({
-  target: () => window,
-  type: "keydown",
-  filterMapEvent: escapeMessage,
-  options: { capture: true },
-});
-
 const holdingSubscriptions = Subscription.make<Model, Message>()((entry) => ({
   escape: entry(
     { isHolding: Schema.Boolean },
     {
       modelToDependencies: (model) => ({ isHolding: isHolding(model) }),
       dependenciesToStream: ({ isHolding: isHoldingNow }) =>
-        isHoldingNow ? escapeKeys : Stream.empty,
+        isHoldingNow ? escapeKeys(Message.PressedEscape()) : Stream.empty,
     },
   ),
 }));
@@ -644,15 +591,7 @@ export const SizeLiftedCard = Mount.define("SizeLiftedCard", {
   messages: [Message.CompletedSizeLiftedCard],
   execute: ({ element, cardHook: hook, pressX, pressY }) =>
     Effect.sync(() => {
-      const maybeCard = Option.fromNullishOr(
-        document.querySelector(`[data-sortable-id="${CSS.escape(hook)}"]`),
-      );
-      if (Option.isSome(maybeCard) && element instanceof HTMLElement) {
-        const rect = maybeCard.value.getBoundingClientRect();
-        element.style.setProperty("--lift-width", `${rect.width}px`);
-        element.style.setProperty("--lift-x", `${rect.left - pressX}px`);
-        element.style.setProperty("--lift-y", `${rect.top - pressY}px`);
-      }
+      measureLift(element, `[data-sortable-id="${CSS.escape(hook)}"]`, pressX, pressY);
       return Message.CompletedSizeLiftedCard();
     }),
 });
@@ -693,17 +632,7 @@ export type ViewInputs = Readonly<{
   toColumnAttributes?: (column: Column) => ReadonlyArray<ChildAttribute>;
 }>;
 
-const LEFT_BUTTON = 0;
-
-const INNER_CONTROL = [
-  "input",
-  "textarea",
-  "select",
-  "a[href]",
-  '[contenteditable]:not([contenteditable="false"])',
-  `button:not([data-${TITLE_ATTRIBUTE}]):not([data-${GRIP_ATTRIBUTE}])`,
-  "[data-no-lift]",
-].join(", ");
+const INNER_CONTROL = innerControls(`[data-${TITLE_ATTRIBUTE}], [data-${GRIP_ATTRIBUTE}]`);
 
 const isInside = (outer: Element, inner: Element | null): boolean =>
   inner !== null && outer.contains(inner);
@@ -961,7 +890,9 @@ const columnView = (info: PlaceInfo, column: Column, h: HtmlBuilder<Message>): H
           ),
           ...Array.match(items, {
             onEmpty: () => info.toEmptyView(column),
-            onNonEmpty: (cards) => [h.ul([h.Class("board-cards")], cards)],
+            // NOTE: Safari takes list semantics from a list printed without markers, so the
+            // list says it is one
+            onNonEmpty: (cards) => [h.ul([h.Role("list"), h.Class("board-cards")], cards)],
           }),
         ],
       ),

package/src/button/button.ts

@@ -107,7 +107,7 @@ const wordsView = <Message>(
  * While busy it is `aria-busy` too.
  *
  * Enter in a field can still submit a form that has no live submit button, so the form's
- * own update must ignore a submit while its work is saving (see `Card`'s `onSubmit`).
+ * own update must ignore a submit while its work is saving (see `Card.formView`).
  */
 export const view = <Message>(config: ViewConfig<Message>, h: HtmlBuilder<Message>): Html => {
   const {