@gjermundgaraba-designs/pixel-paper 0.25.0 → 0.27.0

package/dist/src/board/board.js

@@ -2,7 +2,7 @@ import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
 import { Button as UiButton, DragAndDrop as UiDragAndDrop } from "@foldkit/ui";
 import { Array, Effect, Equal, Match, Option, Schema, pipe } from "effect";
 import * as Command from "foldkit/command";
-import { childAttributes, } from "foldkit/html";
+import { childAttributes } from "foldkit/html";
 import { defineMessageUnion } from "foldkit/message";
 import * as Mount from "foldkit/mount";
 import { modifyFields } from "foldkit/struct";
@@ -11,13 +11,12 @@ import * as Subscription from "foldkit/subscription";
 import * as Update from "foldkit/update";
 import * as Announcer from "../announcer/announcer.js";
 import * as Button from "../button/button.js";
+import { LEFT_BUTTON, activatedKeyboardDrag, canLift, cancelledDrag, escapeSubscriptions, innerControls, isCarrying, measureLift, phaseOf, pressedDraggable, settle as settleDrag, } from "../drag/drag.js";
 import * as Glyph from "../glyph/glyph.js";
-import * as IconButton from "../iconButton/iconButton.js";
+import * as IconButton from "../icon-button/icon-button.js";
 import { LOCALE } from "../locale/locale.js";
 import { slotView } from "../slot/slot.js";
-import { prefixKeys } from "../subscription/prefixKeys.js";
-import { LEFT_BUTTON, activatedKeyboardDrag, canLift, cancelledDrag, escapeSubscriptions, innerControls, isCarrying, measureLift, phaseOf, pressedDraggable, settle as settleDrag, } from "../drag/drag.js";
-// MODEL
+import { prefixKeys } from "../subscription/prefix-keys.js";
 /** Schema for one card as the board knows it: its id, unique across the board, and its name
  *  in words, which the grip and screen readers use. */
 export const Card = Schema.Struct({ id: Schema.String, label: Schema.String });
@@ -27,38 +26,24 @@ export const Column = Schema.Struct({
     title: Schema.String,
     cards: Schema.Array(Card),
 });
-/** How the keyboard carries what it holds: said on the grip and once it is picked up. */
 const KEYBOARD_MOVES = "Arrow keys move it to another column, space drops it, escape cancels.";
-/** The words a board says. `{card}` stands for the card's label and `{column}` for a
- *  column's title. */
 const COPY = {
-    /** The grip's name. */
     gripLabel: "Move {card}",
-    /** What the grip describes: how to move a card from the keyboard. */
     gripHelp: `Press space to pick the card up. ${KEYBOARD_MOVES}`,
-    /** A pointer has lifted the card. */
     pickedUp: "Picked up {card}.",
-    /** The keyboard has lifted the card: say how to go on. */
     pickedUpByKeyboard: `Picked up {card}. ${KEYBOARD_MOVES}`,
-    /** The held card is over another column. */
     over: "{card} is over {column}.",
-    /** The card was dropped in a column. */
     dropped: "{card} dropped in {column}.",
-    /** The card was let go where it already was, or over no column. */
     putBack: "{card} put back where it was.",
-    /** Escape, or the application, cancelled the move. */
     cancelled: "Move cancelled. {card} put back where it was.",
 };
-const PressPoint = Schema.Struct({ clientX: Schema.Number, clientY: Schema.Number });
-/** What the board keeps while a card is pressed or held: the card, the columns as the view had
- *  them when it was pressed, and where a pointer pressed it (none for the keyboard). The
- *  columns are the parent's and reach the board only through its view, so the press carries
- *  them and they are kept: a drop is placed against them (the destination's other cards give
- *  `toIndex` and the neighbours), as the reader saw them when picking the card up, and each
- *  step is said with their titles. */
+const PressPoint = Schema.Struct({
+    clientX: Schema.Finite,
+    clientY: Schema.Finite,
+});
 const Held = Schema.Struct({
     card: Card,
-    columns: Schema.Array(Column),
+    columnsAtPress: Schema.Array(Column),
     maybePressPoint: Schema.Option(PressPoint),
 });
 /** Schema for a board: the `@foldkit/ui` DragAndDrop it moves cards with, whether cards may
@@ -68,8 +53,6 @@ export const Model = Schema.Struct({
     isMovable: Schema.Boolean,
     maybeHeld: Schema.Option(Held),
 });
-// MESSAGE
-/** Where on a card a press landed: its body (which selects it) or its grip. */
 const PressSpot = Schema.Literals(["Body", "Grip"]);
 /** Union of all Messages a board can produce. */
 export const Message = defineMessageUnion({
@@ -78,18 +61,20 @@ export const Message = defineMessageUnion({
         cardId: Schema.String,
         spot: PressSpot,
         pointerType: Schema.String,
-        screenX: Schema.Number,
-        screenY: Schema.Number,
-        clientX: Schema.Number,
-        clientY: Schema.Number,
-        columns: Schema.Array(Column),
+        screenX: Schema.Finite,
+        screenY: Schema.Finite,
+        clientX: Schema.Finite,
+        clientY: Schema.Finite,
+        columnsAtPress: Schema.Array(Column),
+    },
+    PressedGripKey: {
+        cardId: Schema.String,
+        columnsAtPress: Schema.Array(Column),
     },
-    PressedGripKey: { cardId: Schema.String, columns: Schema.Array(Column) },
     PressedEscape: {},
     CompletedAnnounceMove: {},
     CompletedSizeLiftedCard: {},
 });
-// OUT MESSAGE
 /**
  * Union of OutMessages a board reports.
  *
@@ -105,9 +90,9 @@ export const OutMessage = defineMessageUnion({
     Moved: {
         cardId: Schema.String,
         fromColumnId: Schema.String,
-        fromIndex: Schema.Number,
+        fromIndex: Schema.Finite,
         toColumnId: Schema.String,
-        toIndex: Schema.Number,
+        toIndex: Schema.Finite,
         maybeAfterCardId: Schema.Option(Schema.String),
         maybeBeforeCardId: Schema.Option(Schema.String),
     },
@@ -120,19 +105,15 @@ export const init = (config) => (__foldkitBrandViewResult(({
     isMovable: config.isMovable ?? true,
     maybeHeld: Option.none(),
 }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#init"));
-// ACCESSORS
 /** The board's id, unique in the document. */
 export const id = (model) => __foldkitBrandViewResult((model.dragAndDrop.id), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#id");
-/** Whether a card is held by a pointer or the keyboard. */
 export const isDragging = (model) => __foldkitBrandViewResult((UiDragAndDrop.isDragging(model.dragAndDrop)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#isDragging");
-// DOM HOOKS
 const hookId = (boardId, localId) => __foldkitBrandViewResult((`${boardId}/${localId}`), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#hookId");
 const cardHook = (model, cardId) => __foldkitBrandViewResult((hookId(id(model), cardId)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cardHook");
 const columnHook = (model, columnId) => __foldkitBrandViewResult((hookId(id(model), columnId)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#columnHook");
 const CARD_ATTRIBUTE = "board-card";
 const TITLE_ATTRIBUTE = "board-title";
 const GRIP_ATTRIBUTE = "board-grip";
-// COMMAND
 /** 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", {
@@ -142,10 +123,10 @@ export const AnnounceMove = Command.define("AnnounceMove", {
 });
 const placeOf = (columns, cardId) => __foldkitBrandViewResult((Array.findFirst(columns, (column) => __foldkitBrandViewResult((Array.findFirst(Array.map(column.cards, (card, index) => (__foldkitBrandViewResult(({ card, column, index }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~2"))), ({ card }) => __foldkitBrandViewResult((card.id === cardId), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~3"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#placeOf");
 const fill = (template, card, column = "") => __foldkitBrandViewResult((template.replaceAll("{card}", card).replaceAll("{column}", column)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#fill");
-const columnOfHook = (model, held, hook) => __foldkitBrandViewResult((Array.findFirst(held.columns, (column) => __foldkitBrandViewResult((columnHook(model, column.id) === hook), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~4"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#columnOfHook");
+const columnOfHook = (model, held, hook) => __foldkitBrandViewResult((Array.findFirst(held.columnsAtPress, (column) => __foldkitBrandViewResult((columnHook(model, column.id) === hook), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~4"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#columnOfHook");
 const overColumn = (model) => __foldkitBrandViewResult((Option.flatMap(model.maybeHeld, (held) => __foldkitBrandViewResult((Option.flatMap(UiDragAndDrop.maybeDropTarget(model.dragAndDrop), ({ containerId }) => __foldkitBrandViewResult((columnOfHook(model, held, containerId)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~6"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~5"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#overColumn");
 const placementOf = (model, held, toContainerId, rawIndex) => __foldkitBrandViewResult((Option.gen(function* () {
-    const from = yield* placeOf(held.columns, held.card.id);
+    const from = yield* placeOf(held.columnsAtPress, held.card.id);
     const to = yield* columnOfHook(model, held, toContainerId);
     const others = Array.filter(to.cards, (card) => __foldkitBrandViewResult((card.id !== held.card.id), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~8"));
     const isSameColumn = to.id === from.column.id;
@@ -178,10 +159,8 @@ const foldDragAndDrop = Update.foldChild({
     toParentMessage: toDragAndDropMessage,
     foldOutMessage: foldDragAndDropOutMessage,
 });
-/** What screen readers hear for one step of a move, from the phase before and after it.
- *  `putBack` is what a card set down without a move says: put back, or cancelled. */
 const moveText = (held, previous, next, maybeOutMessage, putBack) => {
-    const label = held.card.label;
+    const { label } = held.card;
     const before = phaseOf(previous.dragAndDrop);
     const after = phaseOf(next.dragAndDrop);
     const maybeMoved = Option.filter(maybeOutMessage, (outMessage) => __foldkitBrandViewResult((outMessage._tag === "Moved"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~14"));
@@ -199,25 +178,23 @@ const moveText = (held, previous, next, maybeOutMessage, putBack) => {
     else if (before === "Idle" && after === "KeyboardDragging") {
         return __foldkitBrandViewResult((Option.some(fill(COPY.pickedUpByKeyboard, label))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#moveText");
     }
-    else {
-        return __foldkitBrandViewResult((pipe(overColumn(next), Option.filter((column) => __foldkitBrandViewResult((!Equal.equals(Option.map(overColumn(previous), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~17")), Option.some(column.id))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~16")), Option.map((column) => __foldkitBrandViewResult((fill(COPY.over, label, column.title)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~18")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#moveText");
-    }
+    return __foldkitBrandViewResult((pipe(overColumn(next), Option.filter((column) => __foldkitBrandViewResult((!Equal.equals(Option.map(overColumn(previous), (over) => __foldkitBrandViewResult((over.id), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~17")), Option.some(column.id))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~16")), Option.map((column) => __foldkitBrandViewResult((fill(COPY.over, label, column.title)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~18")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#moveText");
 };
-/** Announces the step a DragAndDrop update took and forgets the held card once it is down.
- *  A card set down without a move says `putBack`. */
 const settle = (previous, putBack = COPY.putBack) => __foldkitBrandViewResult(((dragAndDropUpdate) => __foldkitBrandViewResult((settleDrag(dragAndDropUpdate, Option.map(Option.flatMap(previous.maybeHeld, (held) => __foldkitBrandViewResult((moveText(held, previous, dragAndDropUpdate.model, Option.fromNullishOr(dragAndDropUpdate.outMessage), putBack)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~20")), (text) => __foldkitBrandViewResult((AnnounceMove({ text })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~21")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~19")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#settle");
 const holding = (model, held) => __foldkitBrandViewResult((modifyFields(model, { maybeHeld: () => __foldkitBrandViewResult((Option.some(held)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#maybeHeld") })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#holding");
-const liftByKeyboard = (model, place, columns) => {
-    const pressed = holding(model, { card: place.card, columns, maybePressPoint: Option.none() });
+const liftByKeyboard = (model, place, columnsAtPress) => {
+    const pressed = holding(model, {
+        card: place.card,
+        columnsAtPress,
+        maybePressPoint: Option.none(),
+    });
     return __foldkitBrandViewResult((settle(pressed)(foldDragAndDrop(pressed, activatedKeyboardDrag({
         itemId: cardHook(model, place.card.id),
         containerId: columnHook(model, place.column.id),
         index: place.index,
     })))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#liftByKeyboard");
 };
-// NOTE: every arrow jumps a column in reading order, so one press is one column whether the
-// columns sit side by side or stack on a phone. The ui's own arrows move within a column.
-const toColumnDirection = (direction) => __foldkitBrandViewResult((Match.value(direction).pipe(Match.withReturnType(), Match.whenOr("Left", "Up", () => __foldkitBrandViewResult(("PreviousContainer"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~22")), Match.whenOr("Right", "Down", () => __foldkitBrandViewResult(("NextContainer"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~23")), Match.orElse(() => __foldkitBrandViewResult((direction), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~24")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#toColumnDirection");
+const toColumnStepInReadingOrder = (direction) => __foldkitBrandViewResult((Match.value(direction).pipe(Match.withReturnType(), Match.whenOr("Left", "Up", () => __foldkitBrandViewResult(("PreviousContainer"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~22")), Match.whenOr("Right", "Down", () => __foldkitBrandViewResult(("NextContainer"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~23")), Match.orElse(() => __foldkitBrandViewResult((direction), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~24")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#toColumnStepInReadingOrder");
 const moveByKeyboard = (model, direction) => __foldkitBrandViewResult((Option.match(Option.filter(Option.all({
     itemId: UiDragAndDrop.maybeDraggedItemId(model.dragAndDrop),
     target: UiDragAndDrop.maybeDropTarget(model.dragAndDrop),
@@ -230,32 +207,25 @@ const moveByKeyboard = (model, direction) => __foldkitBrandViewResult((Option.ma
                 itemId,
                 currentContainerId: target.containerId,
                 currentIndex: target.index,
-                direction: toColumnDirection(direction),
+                direction: toColumnStepInReadingOrder(direction),
             }), toDragAndDropMessage),
         ],
     }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onSome~2")),
 })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#moveByKeyboard");
-// NOTE: @foldkit/ui gap: DragAndDrop's ResolveKeyboardMove walks every `[data-droppable-id]`
-// in the document. A column it finds past this board's first or last is another list's, so
-// that step is not taken.
 const isOwnColumnHook = (model, hook) => __foldkitBrandViewResult((Option.exists(model.maybeHeld, (held) => __foldkitBrandViewResult((Option.isSome(columnOfHook(model, held, hook))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~26"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#isOwnColumnHook");
-/** DragAndDrop's own cancel (the card back where it was, focus back on a keyboard-held card's
- *  grip), said as a cancel rather than a card put back. */
 const cancelDrag = (model, message) => __foldkitBrandViewResult((settle(model, COPY.cancelled)(foldDragAndDrop(model, message))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cancelDrag");
 const updateDragAndDrop = (model, message) => __foldkitBrandViewResult((Match.value(message).pipe(Match.withReturnType(), Match.tag("PressedArrowKey", ({ direction }) => __foldkitBrandViewResult((moveByKeyboard(model, direction)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~27")), Match.tag("CompletedResolveKeyboardMove", ({ targetContainerId }) => __foldkitBrandViewResult((isOwnColumnHook(model, targetContainerId)
     ? settle(model)(foldDragAndDrop(model, message))
     : { model }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~28")), Match.tag("CancelledDrag", () => __foldkitBrandViewResult((cancelDrag(model, message)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~29")), Match.orElse(() => __foldkitBrandViewResult((settle(model)(foldDragAndDrop(model, message))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~30")))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#updateDragAndDrop");
-/** A press on a card: on its body it selects the card (while nothing is held); under a mouse,
- *  or on the grip, it also presses the card for a drag while cards may move. */
-const pressCard = (model) => __foldkitBrandViewResult((({ cardId, spot, pointerType, screenX, screenY, clientX, clientY, columns, }) => {
+const pressCard = (model) => __foldkitBrandViewResult((({ cardId, spot, pointerType, screenX, screenY, clientX, clientY, columnsAtPress, }) => {
     const maybeSelected = Option.liftPredicate(OutMessage.SelectedCard({ cardId }), () => __foldkitBrandViewResult((spot === "Body" && phaseOf(model.dragAndDrop) === "Idle"), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~32"));
     const isLifting = canLift(model) && (spot === "Grip" || pointerType === "mouse");
-    const press = Option.match(Option.filter(placeOf(columns, cardId), () => __foldkitBrandViewResult((isLifting), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~33")), {
+    const press = Option.match(Option.filter(placeOf(columnsAtPress, cardId), () => __foldkitBrandViewResult((isLifting), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~33")), {
         onNone: () => (__foldkitBrandViewResult(({ model }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onNone~3")),
         onSome: (place) => {
             const pressed = holding(model, {
                 card: place.card,
-                columns,
+                columnsAtPress,
                 maybePressPoint: Option.some({ clientX, clientY }),
             });
             return __foldkitBrandViewResult((settle(pressed)(foldDragAndDrop(pressed, pressedDraggable({
@@ -267,30 +237,28 @@ const pressCard = (model) => __foldkitBrandViewResult((({ cardId, spot, pointerT
             })))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onSome~3");
         },
     });
-    // a press reports nothing of its own, so the selection is the step's one OutMessage
     return __foldkitBrandViewResult((Option.match(maybeSelected, {
         onNone: () => __foldkitBrandViewResult((press), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onNone~4"),
         onSome: (selected) => (__foldkitBrandViewResult(({ ...press, outMessage: selected }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onSome~4")),
     })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~31");
 }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#pressCard");
+/**
+ * Puts a pressed or held card back where it was, says so, and reports no move. A keyboard
+ * move hands focus back to the card's grip. Call it when the layout changes under the board.
+ */
+export const cancel = (model) => __foldkitBrandViewResult((cancelDrag(model, cancelledDrag())), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cancel");
 /** Processes a board Message and returns the next Model, Commands and OutMessage. */
 export const update = (model, message) => __foldkitBrandViewResult((Message.match(message, {
     GotDragAndDropMessage: ({ message: dragAndDropMessage }) => __foldkitBrandViewResult((updateDragAndDrop(model, dragAndDropMessage)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#GotDragAndDropMessage"),
     PressedCard: pressCard(model),
-    PressedGripKey: ({ cardId, columns }) => __foldkitBrandViewResult((Option.match(Option.filter(placeOf(columns, cardId), () => __foldkitBrandViewResult((canLift(model)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~34")), {
+    PressedGripKey: ({ cardId, columnsAtPress }) => __foldkitBrandViewResult((Option.match(Option.filter(placeOf(columnsAtPress, cardId), () => __foldkitBrandViewResult((canLift(model)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~34")), {
         onNone: () => (__foldkitBrandViewResult(({ model }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onNone~5")),
-        onSome: (place) => __foldkitBrandViewResult((liftByKeyboard(model, place, columns)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onSome~5"),
+        onSome: (place) => __foldkitBrandViewResult((liftByKeyboard(model, place, columnsAtPress)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onSome~5"),
     })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#PressedGripKey"),
     PressedEscape: () => __foldkitBrandViewResult((cancel(model)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#PressedEscape"),
     CompletedAnnounceMove: () => (__foldkitBrandViewResult(({ model }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#CompletedAnnounceMove")),
     CompletedSizeLiftedCard: () => (__foldkitBrandViewResult(({ model }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#CompletedSizeLiftedCard")),
 })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#update");
-// CAPABILITIES
-/**
- * Puts a pressed or held card back where it was, says so, and reports no move. A keyboard
- * move hands focus back to the card's grip. Call it when the layout changes under the board.
- */
-export const cancel = (model) => __foldkitBrandViewResult((cancelDrag(model, cancelledDrag())), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cancel");
 /**
  * Lets cards move, or stops them: while work runs, nothing moves. Stopping cancels a card
  * that is pressed or held, so no `Moved` arrives for it.
@@ -299,9 +267,6 @@ export const setMovable = (model, isMovable) => {
     const next = modifyFields(model, { isMovable: () => __foldkitBrandViewResult((isMovable), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#isMovable") });
     return __foldkitBrandViewResult((isMovable ? { model: next } : cancel(next)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#setMovable");
 };
-// SUBSCRIPTION
-// NOTE: @foldkit/ui gap: DragAndDrop's Subscription keys are fixed, so two of its users on a
-// page would share them. The board lifts them under its own names, behind the parent's prefix.
 const dragSubscriptions = Subscription.lift({
     pointer: UiDragAndDrop.subscriptions.documentPointer,
     keyboard: UiDragAndDrop.subscriptions.documentKeyboard,
@@ -319,11 +284,14 @@ const boardSubscriptions = Subscription.aggregate(escapeSubscriptions(Message.Pr
  *  `queueBoardKeyboard` and `queueBoardAutoScroll`, so two boards (or a board beside another
  *  DragAndDrop user) aggregate side by side. */
 export const subscriptions = (keyPrefix) => __foldkitBrandViewResult((prefixKeys(keyPrefix, boardSubscriptions)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#subscriptions");
-// LIFTED CARD
 /** Sizes the copy that follows the pointer to the card it lifts, and keeps the pointer where
  *  it pressed the card. Measures the card once, when the copy appears. */
 export const SizeLiftedCard = Mount.define("SizeLiftedCard", {
-    args: { cardHook: Schema.String, pressX: Schema.Number, pressY: Schema.Number },
+    args: {
+        cardHook: Schema.String,
+        pressX: Schema.Finite,
+        pressY: Schema.Finite,
+    },
     messages: [Message.CompletedSizeLiftedCard],
     execute: ({ element, cardHook: hook, pressX, pressY }) => __foldkitBrandViewResult((Effect.sync(() => {
         measureLift(element, `[data-sortable-id="${CSS.escape(hook)}"]`, pressX, pressY);
@@ -332,7 +300,6 @@ export const SizeLiftedCard = Mount.define("SizeLiftedCard", {
 });
 const INNER_CONTROL = innerControls(`[data-${TITLE_ATTRIBUTE}], [data-${GRIP_ATTRIBUTE}]`);
 const isInside = (outer, inner) => __foldkitBrandViewResult((inner !== null && outer.contains(inner)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#isInside");
-/** Where a press on a card landed: its body, its grip, or a control inside it (none). */
 const pressSpotOf = (target) => {
     if (!(target instanceof Element)) {
         return __foldkitBrandViewResult((Option.some("Body")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#pressSpotOf");
@@ -346,9 +313,7 @@ const pressSpotOf = (target) => {
     else if (isOnGrip) {
         return __foldkitBrandViewResult((Option.some("Grip")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#pressSpotOf");
     }
-    else {
-        return __foldkitBrandViewResult((Option.some("Body")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#pressSpotOf");
-    }
+    return __foldkitBrandViewResult((Option.some("Body")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#pressSpotOf");
 };
 const gripHelpId = (model) => __foldkitBrandViewResult((`${id(model)}-grip-help`), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#gripHelpId");
 const isHeldCard = (model, cardId) => __foldkitBrandViewResult((isDragging(model) &&
@@ -358,7 +323,11 @@ const liftedRender = (h) => (__foldkitBrandViewResult(({
     isMovable: false,
     isHeld: false,
     grip: [
-        h.span([h.Class("iconbtn"), h.DataAttribute(GRIP_ATTRIBUTE, ""), h.AriaHidden(true)], [Glyph.view({ name: "grip" }, h)]),
+        h.span([
+            h.Class("iconbtn"),
+            h.DataAttribute(GRIP_ATTRIBUTE, ""),
+            h.AriaHidden(true),
+        ], [Glyph.view({ name: "grip" }, h)]),
     ],
     isLifted: true,
 }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#liftedRender"));
@@ -375,13 +344,9 @@ const cardRender = (info, place, h) => {
         screenY,
         clientX,
         clientY,
-        columns,
+        columnsAtPress: columns,
     })), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~40"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~38"));
-    const onGripKey = h.OnKeyDownPreventDefault((key) => __foldkitBrandViewResult((Option.liftPredicate(Message.PressedGripKey({ cardId: card.id, columns }), () => __foldkitBrandViewResult((isIdleNow && (key === " " || key === "Enter")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~42"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~41"));
-    // NOTE: @foldkit/ui gap: DragAndDrop's `draggable` bundle forces `role="option"` and
-    // `data-sortable-id`, which belong on a list's own items, and the card's `li` already
-    // carries `sortable`. So the grip carries the ui's `data-draggable-id` by hand, and
-    // FocusItem finds the grip by it.
+    const onGripKey = h.OnKeyDownPreventDefault((key) => __foldkitBrandViewResult((Option.liftPredicate(Message.PressedGripKey({ cardId: card.id, columnsAtPress: columns }), () => __foldkitBrandViewResult((isIdleNow && (key === " " || key === "Enter")), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~42"))), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~41"));
     const grip = model.isMovable
         ? [
             IconButton.view({
@@ -407,7 +372,7 @@ const cardRender = (info, place, h) => {
         isLifted: false,
     }), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cardRender");
 };
-const cardClass = ({ isMovable: movable, isHeld, isLifted }) => __foldkitBrandViewResult((`board-card${movable ? " movable" : ""}${isHeld ? " drag-dim" : ""}${isLifted ? " lifted" : ""}`), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cardClass");
+const cardClass = ({ isMovable: movable, isHeld, isLifted, }) => __foldkitBrandViewResult((`board-card${movable ? " movable" : ""}${isHeld ? " drag-dim" : ""}${isLifted ? " lifted" : ""}`), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#cardClass");
 /**
  * One card on the board, from what the board handed `toCardView`: `article.board-card`, a
  * paper slip on the 3px print shadow, its title a two-line `button.title` (or `span.title`
@@ -416,7 +381,7 @@ const cardClass = ({ isMovable: movable, isHeld, isLifted }) => __foldkitBrandVi
  * `aria-current="true"` through `attributes` for the board's cursor, which prints inverted.
  */
 export const cardView = (config, h) => {
-    const { render, title, onOpen, isDisabled = false, editor = [], meta = [] } = config;
+    const { render, title, onOpen, isDisabled = false, editor = [], meta = [], } = config;
     const attributes = render.isLifted ? [] : (config.attributes ?? []);
     const isEditing = !render.isLifted && Array.isReadonlyArrayNonEmpty(editor);
     const titleView = onOpen === undefined
@@ -424,7 +389,11 @@ export const cardView = (config, h) => {
         : UiButton.view({
             onClick: onOpen,
             isDisabled,
-            toView: (groups) => __foldkitBrandViewResult((h.button([...groups.button, h.DataAttribute(TITLE_ATTRIBUTE, ""), h.Class("title")], [title])), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#toView"),
+            toView: (groups) => __foldkitBrandViewResult((h.button([
+                ...groups.button,
+                h.DataAttribute(TITLE_ATTRIBUTE, ""),
+                h.Class("title"),
+            ], [title])), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#toView"),
         }, h);
     return __foldkitBrandViewResult((h.article([...attributes, ...render.attributes, h.Class(cardClass(render))], [
         ...(isEditing ? editor : [titleView]),
@@ -448,9 +417,6 @@ const columnView = (info, column, h) => {
     ];
     const isTarget = isDragging(model) &&
         Equal.equals(Option.map(overColumn(model), ({ id: overId }) => __foldkitBrandViewResult((overId), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~47")), Option.some(column.id));
-    // NOTE: @foldkit/ui gap: DragAndDrop's `droppable` bundle forces `role="listbox"`, which
-    // would claim cards that are not options. So the column carries the ui's
-    // `data-droppable-id` by hand, and drops are found by it.
     return __foldkitBrandViewResult((h.keyed("div")(column.id, [
         h.DataAttribute("droppable-id", columnHook(model, column.id)),
         h.Class(isTarget ? "board-col drop-target" : "board-col"),
@@ -463,9 +429,9 @@ const columnView = (info, column, h) => {
             ]),
             ...Array.match(items, {
                 onEmpty: () => __foldkitBrandViewResult((info.toEmptyView(column)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onEmpty"),
-                // NOTE: Safari takes list semantics from a list printed without markers, so the
-                // list says it is one
-                onNonEmpty: (cards) => __foldkitBrandViewResult(([h.ul([h.Role("list"), h.Class("board-cards")], cards)]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onNonEmpty"),
+                onNonEmpty: (cards) => __foldkitBrandViewResult(([
+                    h.ul([h.Role("list"), h.Class("board-cards")], cards),
+                ]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#onNonEmpty"),
             }),
         ]),
     ])), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#columnView");
@@ -504,12 +470,20 @@ const liftedCopyView = (info, h) => {
  * follows the pointer or the keys.
  */
 export const view = defineView((model, viewInputs, h) => {
-    const { columns, toCardView, toEmptyView = () => __foldkitBrandViewResult(([]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~51"), toColumnActions = () => __foldkitBrandViewResult(([]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~52") } = viewInputs;
-    const info = { model, columns, toCardView, toEmptyView, toColumnActions };
+    const { columns, toCardView, toEmptyView = () => __foldkitBrandViewResult(([]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~51"), toColumnActions = () => __foldkitBrandViewResult(([]), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~52"), } = viewInputs;
+    const info = {
+        model,
+        columns,
+        toCardView,
+        toEmptyView,
+        toColumnActions,
+    };
     return __foldkitBrandViewResult((h.div([h.Class("board"), h.Style({ "--cols": `${columns.length}` })], [
         ...Array.map(columns, (column) => __foldkitBrandViewResult((columnView(info, column, h)), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~53")),
         ...(model.isMovable
-            ? [h.p([h.Id(gripHelpId(model)), h.Class("sr-only")], [COPY.gripHelp])]
+            ? [
+                h.p([h.Id(gripHelpId(model)), h.Class("sr-only")], [COPY.gripHelp]),
+            ]
             : []),
         ...liftedCopyView(info, h),
     ])), "@gjermundgaraba-designs/pixel-paper/src/board/board.js#anonymous~50");

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

@@ -1,4 +1,4 @@
 export { AnnounceMove, Card, Column, Message, Model, OutMessage, SizeLiftedCard, cancel, cardView, id, init, setMovable, subscriptions, update, view, } from "./board.ts";
 export { isHolding } from "../drag/drag.ts";
-export type { CardRender, CardViewConfig, InitConfig, ViewInputs } from "./board.ts";
+export type { CardRender, CardViewConfig, InitConfig, ViewInputs, } from "./board.ts";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/board/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,MAAM,EACN,OAAO,EACP,KAAK,EACL,UAAU,EACV,cAAc,EACd,MAAM,EACN,QAAQ,EACR,EAAE,EACF,IAAI,EACJ,UAAU,EACV,aAAa,EACb,MAAM,EACN,IAAI,GACL,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/board/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,MAAM,EACN,OAAO,EACP,KAAK,EACL,UAAU,EACV,cAAc,EACd,MAAM,EACN,QAAQ,EACR,EAAE,EACF,IAAI,EACJ,UAAU,EACV,aAAa,EACb,MAAM,EACN,IAAI,GACL,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,YAAY,EACV,UAAU,EACV,cAAc,EACd,UAAU,EACV,UAAU,GACX,MAAM,YAAY,CAAC"}

package/dist/src/button/button.d.ts

@@ -3,7 +3,7 @@ import type { KeySequence } from "foldkit/dom";
 import type { Attribute, Html, HtmlBuilder } from "foldkit/html";
 import type { Attributes } from "../attributes/attributes.ts";
 import type { GlyphName } from "../glyph/glyphs.ts";
-import type { KeyPlatform } from "../keyHint/keyLabel.ts";
+import type { KeyPlatform } from "../key-hint/key-label.ts";
 /** How a button prints. `Primary` is the one committing action. `Danger` is the commit inside a
  *  confirm, never at rest: a destructive action is a neutral button that opens a danger
  *  `ConfirmDialog`. */
@@ -16,7 +16,6 @@ export type Look = Readonly<{
     /** The action Enter takes in a card: a double ring instead of the print shadow. */
     isDefault?: boolean;
 }>;
-/** The class list of a printed button. Shared with `LinkButton`. */
 export declare const lookClassName: ({ variant, isSmall, isDefault, }: Look) => string;
 /** A button that can end done: it prints in ink, flat and unavailable, with the check in its
  *  glyph's place. Both words print in one cell, the other hidden, so the button is as wide as

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

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,MAAM,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAI1D;;uBAEuB;AACvB,eAAO,MAAM,OAAO,4DAAoD,CAAC;AACzE,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAC;AAE1C,yFAAyF;AACzF,MAAM,MAAM,IAAI,GAAG,QAAQ,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mFAAmF;IACnF,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC,CAAC;AAQH,oEAAoE;AACpE,eAAO,MAAM,aAAa,qCAIvB,IAAI,KAAG,MACgF,CAAC;AAI3F;;+CAE+C;AAC/C,MAAM,MAAM,IAAI,GAAG,QAAQ,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,+EAA+E;AAC/E,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC;IACnC,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,WAAW,CAAC;CACvB,CAAC,CAAC;AAEH;4DAC4D;AAC5D,eAAO,MAAM,gBAAgB,GAAI,OAAO,aAC3B,OAAO,KACf,WAAW,CAAC,OAAO,CAAC,KACtB,SAAS,CAAC,OAAO,CAAgD,CAAC;AAErE,wDAAwD;AACxD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,IAAI,GACpC,QAAQ,CAAC;IACP,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;wFACoF;IACpF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;sFACkF;IAClF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,uEAAuE;IACvE,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,4FAA4F;IAC5F,UAAU,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAClC,CAAC,GACF,CAAC,QAAQ,CAAC;IAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC,GAAG,QAAQ,CAAC;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,CAAC;AAmBnG;;;;;;;;;GASG;AACH,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IA4CpF,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,MAAM,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;uBAEuB;AACvB,eAAO,MAAM,OAAO,4DAAoD,CAAC;AAEzE,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAC;AAE1C,yFAAyF;AACzF,MAAM,MAAM,IAAI,GAAG,QAAQ,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mFAAmF;IACnF,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC,CAAC;AAQH,eAAO,MAAM,aAAa,qCAIvB,IAAI,KAAG,MACgF,CAAC;AAE3F;;+CAE+C;AAC/C,MAAM,MAAM,IAAI,GAAG,QAAQ,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,+EAA+E;AAC/E,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC;IACnC,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,WAAW,CAAC;CACvB,CAAC,CAAC;AAEH;4DAC4D;AAC5D,eAAO,MAAM,gBAAgB,GAAI,OAAO,aAC3B,OAAO,KACf,WAAW,CAAC,OAAO,CAAC,KACtB,SAAS,CAAC,OAAO,CAAgD,CAAC;AAErE,wDAAwD;AACxD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,IAAI,GACpC,QAAQ,CAAC;IACP,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;wFACoF;IACpF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;sFACkF;IAClF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,uEAAuE;IACvE,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,4FAA4F;IAC5F,UAAU,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAClC,CAAC,GACF,CACI,QAAQ,CAAC;IAAE,KAAK,CAAC,EAAE,SAAS,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC,GACjD,QAAQ,CAAC;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAC7C,CAAC;AAmBJ;;;;;;;;;GASG;AACH,eAAO,MAAM,IAAI,GAAI,OAAO,UAClB,UAAU,CAAC,OAAO,CAAC,KACxB,WAAW,CAAC,OAAO,CAAC,KACtB,IAkDF,CAAC"}

package/dist/src/button/button.js

@@ -2,8 +2,7 @@ import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
 import { Button as UiButton } from "@foldkit/ui";
 import { Option, Schema } from "effect";
 import * as Glyph from "../glyph/glyph.js";
-import * as KeyHint from "../keyHint/keyHint.js";
-// LOOK
+import * as KeyHint from "../key-hint/key-hint.js";
 /** How a button prints. `Primary` is the one committing action. `Danger` is the commit inside a
  *  confirm, never at rest: a destructive action is a neutral button that opens a danger
  *  `ConfirmDialog`. */
@@ -13,7 +12,6 @@ const VARIANT_CLASS = {
     Primary: "btn primary",
     Danger: "btn danger",
 };
-/** The class list of a printed button. Shared with `LinkButton`. */
 export const lookClassName = ({ variant = "Default", isSmall = false, isDefault = false, }) => __foldkitBrandViewResult((`${VARIANT_CLASS[variant]}${isSmall ? " small" : ""}${isDefault ? " default-ring" : ""}`), "@gjermundgaraba-designs/pixel-paper/src/button/button.js#lookClassName");
 /** `aria-pressed` for a toggle button, always present so the button reads as a toggle in
  *  both states. Shared by every pressable in the system. */
@@ -56,10 +54,14 @@ export const view = (config, h) => {
             ...(isWorking ? [h.AriaBusy(true)] : []),
             h.Class(lookClass),
         ], [
-            ...(glyphName === undefined ? [] : [Glyph.view({ name: glyphName }, h)]),
+            ...(glyphName === undefined
+                ? []
+                : [Glyph.view({ name: glyphName }, h)]),
             wordsView(label, maybeDone, h),
             ...(keyHint === undefined ? [] : [KeyHint.view(keyHint, h)]),
-            ...(isWorking ? [h.span([h.Class("cursor"), h.AriaHidden(true)])] : []),
+            ...(isWorking
+                ? [h.span([h.Class("cursor"), h.AriaHidden(true)])]
+                : []),
         ])), "@gjermundgaraba-designs/pixel-paper/src/button/button.js#toView"),
     }, h)), "@gjermundgaraba-designs/pixel-paper/src/button/button.js#view");
 };

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

@@ -1,3 +1,3 @@
 export { pressedAttribute, view } from "./button.ts";
-export type { Done, KeyHintConfig, Look, Variant, ViewConfig } from "./button.ts";
+export type { Done, KeyHintConfig, Look, Variant, ViewConfig, } from "./button.ts";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACrD,YAAY,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAErD,YAAY,EACV,IAAI,EACJ,aAAa,EACb,IAAI,EACJ,OAAO,EACP,UAAU,GACX,MAAM,aAAa,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/card/card.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEtD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAQ9D,sDAAsD;AACtD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,0FAA0F;IAC1F,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC;gDAC4C;IAC5C,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACvC,uEAAuE;IACvE,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC;6DACyD;IACzD,mBAAmB,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC3C,CAAC,CAAC;AAsDH,6FAA6F;AAC7F,eAAO,MAAM,IAAI,GAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,OAAO,CAAC,KAAG,IACd,CAAC;AAIxE;;yDAEyD;AACzD,MAAM,MAAM,cAAc,CAAC,OAAO,IAAI,IAAI,CACxC,UAAU,CAAC,OAAO,CAAC,EACnB,MAAM,GAAG,iBAAiB,GAAG,SAAS,CACvC,GACC,QAAQ,CAAC;IACP,wEAAwE;IACxE,EAAE,EAAE,MAAM,CAAC;IACX;6CACyC;IACzC,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC;;iBAEa;IACb,OAAO,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACvC,wEAAwE;IACxE,MAAM,EAAE,MAAM,CAAC;IACf,yFAAyF;IACzF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;wEACoE;IACpE,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC;;;;;gBAKY;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;6DAEyD;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wEAAwE;IACxE,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC,CAAC;AAEL;;gDAEgD;AAChD,eAAO,MAAM,QAAQ,OAAQ,MAAM,KAAG,MAAwB,CAAC;AAE/D;qFACqF;AACrF,eAAO,MAAM,QAAQ,GAAI,OAAO,UACtB,cAAc,CAAC,OAAO,CAAC,KAC5B,WAAW,CAAC,OAAO,CAAC,KACtB,IAyDF,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/card/card.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEtD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAM9D,sDAAsD;AACtD,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,0FAA0F;IAC1F,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC;gDAC4C;IAC5C,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACvC,uEAAuE;IACvE,IAAI,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACpC;6DACyD;IACzD,mBAAmB,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC3C,CAAC,CAAC;AAyDH,6FAA6F;AAC7F,eAAO,MAAM,IAAI,GAAI,OAAO,UAClB,UAAU,CAAC,OAAO,CAAC,KACxB,WAAW,CAAC,OAAO,CAAC,KACtB,IACoE,CAAC;AAExE;;yDAEyD;AACzD,MAAM,MAAM,cAAc,CAAC,OAAO,IAAI,IAAI,CACxC,UAAU,CAAC,OAAO,CAAC,EACnB,MAAM,GAAG,iBAAiB,GAAG,SAAS,CACvC,GACC,QAAQ,CAAC;IACP,wEAAwE;IACxE,EAAE,EAAE,MAAM,CAAC;IACX;6CACyC;IACzC,IAAI,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACnC;;iBAEa;IACb,OAAO,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IACvC,wEAAwE;IACxE,MAAM,EAAE,MAAM,CAAC;IACf,yFAAyF;IACzF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;wEACoE;IACpE,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACtC;;;;;gBAKY;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;6DAEyD;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wEAAwE;IACxE,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC,CAAC;AAEL;;gDAEgD;AAChD,eAAO,MAAM,QAAQ,OAAQ,MAAM,KAAG,MAAwB,CAAC;AAE/D;qFACqF;AACrF,eAAO,MAAM,QAAQ,GAAI,OAAO,UACtB,cAAc,CAAC,OAAO,CAAC,KAC5B,WAAW,CAAC,OAAO,CAAC,KACtB,IAyDF,CAAC"}

package/dist/src/card/card.js

@@ -2,7 +2,7 @@ import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
 import { Array } from "effect";
 import * as Button from "../button/button.js";
 import * as Fields from "../fields/fields.js";
-import * as IconButton from "../iconButton/iconButton.js";
+import * as IconButton from "../icon-button/icon-button.js";
 import { slotView } from "../slot/slot.js";
 const childrenView = (config, h) => {
     const { title, titleAttributes = [], meta, body, closeAttributes, isCloseHeld = false, actions = [], lead = [], actionBarAttributes = [], } = config;
@@ -22,7 +22,9 @@ const childrenView = (config, h) => {
     ]);
     const actionBar = Array.match([...lead, ...slotView("span", "card-acts", actions, h)], {
         onEmpty: () => __foldkitBrandViewResult(([]), "@gjermundgaraba-designs/pixel-paper/src/card/card.js#onEmpty"),
-        onNonEmpty: (bar) => __foldkitBrandViewResult(([h.div([...actionBarAttributes, h.Class("card-actions")], bar)]), "@gjermundgaraba-designs/pixel-paper/src/card/card.js#onNonEmpty"),
+        onNonEmpty: (bar) => __foldkitBrandViewResult(([
+            h.div([...actionBarAttributes, h.Class("card-actions")], bar),
+        ]), "@gjermundgaraba-designs/pixel-paper/src/card/card.js#onNonEmpty"),
     });
     return __foldkitBrandViewResult(([titleBar, h.div([h.Class("card-body")], body), ...actionBar]), "@gjermundgaraba-designs/pixel-paper/src/card/card.js#childrenView");
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACrD,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAErD,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC"}

package/dist/src/{chartTable/chartTable.d.ts → chart-table/chart-table.d.ts}

@@ -1,27 +1,17 @@
 import { Option } from "effect";
 import type { Html, HtmlBuilder } from "foldkit/html";
-/** A chart's number, in English, so the server and every browser print the same. */
 export declare const chartNumber: (value: number) => string;
-/** A reading, or `None` where there is none: a value left out, or one that is not finite. */
 export declare const chartValue: (maybeValue: Option.Option<number>) => Option.Option<number>;
-/** A chart's top: the given max, else the largest reading, missing ones aside; never below
- *  zero. */
 export declare const chartTop: (values: ReadonlyArray<Option.Option<number>>, maybeMax: Option.Option<number>) => number;
-/** Which labels a run of `count` points prints: every one up to eight, then every nth, so no
- *  more than eight share the axis. The table keeps them all. */
 export declare const labelStep: (count: number) => number;
-/** One row of a chart's table: the point's label, then its readings as words. */
 type ChartTableRow = Readonly<{
     label: string;
-    readings: ReadonlyArray<string>;
+    readings: readonly string[];
 }>;
-/** Configuration for rendering a chart's table with `view`. */
 type ViewConfig = Readonly<{
-    /** The chart's name, the table's caption. */
     label: string;
-    /** The column heads: what the labels name, then one per series. */
-    heads: ReadonlyArray<string>;
-    rows: ReadonlyArray<ChartTableRow>;
+    heads: readonly string[];
+    rows: readonly ChartTableRow[];
 }>;
 /** A chart's data as a real table that only screen readers meet: the picture beside it is
  *  hidden from them, and this says everything the picture does, in order, each point's label
@@ -29,4 +19,4 @@ type ViewConfig = Readonly<{
  *  is a div around it. */
 export declare const view: <Message>(config: ViewConfig, h: HtmlBuilder<Message>) => Html;
 export {};
-//# sourceMappingURL=chartTable.d.ts.map
+//# sourceMappingURL=chart-table.d.ts.map

package/dist/src/chart-table/chart-table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-table.d.ts","sourceRoot":"","sources":["../../../src/chart-table/chart-table.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,MAAM,EAAE,MAAM,QAAQ,CAAC;AACvC,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAMtD,eAAO,MAAM,WAAW,UAAW,MAAM,KAAG,MACd,CAAC;AAE/B,eAAO,MAAM,UAAU,eACT,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAChC,MAAM,CAAC,MAAM,CAAC,MAAM,CACgC,CAAC;AAExD,eAAO,MAAM,QAAQ,WACX,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,YAClC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAC9B,MAWA,CAAC;AAEJ,eAAO,MAAM,SAAS,UAAW,MAAM,KAAG,MACE,CAAC;AAE7C,KAAK,aAAa,GAAG,QAAQ,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,MAAM,EAAE,CAAC;CAC7B,CAAC,CAAC;AAEH,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IACzB,IAAI,EAAE,SAAS,aAAa,EAAE,CAAC;CAChC,CAAC,CAAC;AAEH;;;0BAG0B;AAC1B,eAAO,MAAM,IAAI,GAAI,OAAO,UAClB,UAAU,KACf,WAAW,CAAC,OAAO,CAAC,KACtB,IAkCA,CAAC"}