@gjermundgaraba/pixel-paper 0.0.0-stage → 0.1.0

package/dist/key-help/key-help.d.ts

@@ -0,0 +1,255 @@
+import { KeyPlatform } from "../key-hint/key-label.js";
+import { KeymapGroup } from "../keymap/keymap.js";
+import { Schema } from "effect";
+import { Html } from "foldkit/html";
+import * as Update from "foldkit/update";
+import { KeySequence } from "foldkit/dom";
+/** Schema for the key help: its Dialog and the words in its find field. */
+export declare const Model: Schema.Struct<{
+  readonly dialog: Schema.Struct<{
+    readonly dialog: Schema.Struct<{
+      readonly id: Schema.String;
+      readonly isOpen: Schema.Boolean;
+      readonly isAnimated: Schema.Boolean;
+      readonly animation: Schema.Struct<{
+        readonly id: Schema.String;
+        readonly isShowing: Schema.Boolean;
+        readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
+        readonly transitionGeneration: Schema.Number;
+      }>;
+      readonly maybeFocusSelector: Schema.Option<Schema.String>;
+    }>;
+  }>;
+  readonly query: Schema.String;
+}>;
+export type Model = typeof Model.Type;
+/** One command the keyboard gives, as the help lists it: the keys that give it (any of
+ *  them), the heading it sits under (`"Move"`, `"Edit"`) and what it does (`"Next item"`).
+ *  Describe the same bindings the application hands `Dom.streamFromKeyBindings`, so a key
+ *  never says one thing and does another. */
+export type Binding = Readonly<{
+  keys: readonly KeySequence[];
+  group: string;
+  does: string;
+}>;
+/** The key that opens the help, `?`, which the application binds. */
+export declare const HELP_KEYS: KeySequence;
+/** Union of all Messages the key help can produce. */
+export declare const Message: import("foldkit/message").MessageUnion<{
+  readonly GotDialogMessage: {
+    message: import("foldkit/message").MessageUnion<{
+      readonly GotDialogMessage: {
+        message: import("foldkit/message").MessageUnion<{
+          readonly RequestedOpen: {};
+          readonly RequestedClose: {};
+          readonly SucceededShowDialog: {};
+          readonly FailedShowDialog: {};
+          readonly SucceededAcquireResources: {};
+          readonly FailedAcquireResources: {};
+          readonly CompletedCloseDialog: {};
+          readonly Unmounted: {};
+          readonly CompletedReleaseDialogResources: {};
+          readonly GotAnimationMessage: {
+            message: import("foldkit/message").MessageUnion<{
+              readonly Showed: {};
+              readonly Hid: {};
+              readonly CompletedWaitForPaint: {
+                generation: Schema.Number;
+              };
+              readonly EndedAnimation: {
+                generation: Schema.Number;
+              };
+            }>;
+          };
+        }>;
+      };
+      readonly PressedActionKey: {
+        direction: Schema.Literals<readonly ["Previous", "Next"]>;
+      };
+    }>;
+  };
+  readonly UpdatedQuery: {
+    value: Schema.String;
+  };
+  readonly PressedHelpKey: {};
+}>;
+export type Message = typeof Message.Type;
+/** Union of OutMessages the key help reports: the reader closed it (Escape, a click on the
+ *  veil, a close button). Opening it, by `?` or `open`, reports nothing. */
+export declare const OutMessage: import("foldkit/message").MessageUnion<{
+  readonly Closed: {};
+}>;
+export type OutMessage = typeof OutMessage.Type;
+/** Configuration for creating the key help with `init`. */
+export type InitConfig = Readonly<{
+  id: string;
+}>;
+/** Creates the key help, closed. */
+export declare const init: (config: InitConfig) => Model;
+/** Processes a key help Message and returns the next Model, Commands and OutMessage. */
+export declare const update: (model: Model, message: Message) => Readonly<{
+  model: {
+    readonly dialog: {
+      readonly dialog: {
+        readonly id: string;
+        readonly isOpen: boolean;
+        readonly isAnimated: boolean;
+        readonly animation: {
+          readonly id: string;
+          readonly isShowing: boolean;
+          readonly transitionState: "EnterAnimating" | "EnterStart" | "Idle" | "LeaveAnimating" | "LeaveStart";
+          readonly transitionGeneration: number;
+        };
+        readonly maybeFocusSelector: import("effect/Option").Option<string>;
+      };
+    };
+    readonly query: string;
+  };
+  commands?: Update.Commands<{
+    readonly _tag: "GotDialogMessage";
+    readonly message: {
+      readonly _tag: "GotDialogMessage";
+      readonly message: {
+        readonly _tag: "CompletedCloseDialog";
+      } | {
+        readonly _tag: "CompletedReleaseDialogResources";
+      } | {
+        readonly _tag: "FailedAcquireResources";
+      } | {
+        readonly _tag: "FailedShowDialog";
+      } | {
+        readonly _tag: "GotAnimationMessage";
+        readonly message: {
+          readonly _tag: "CompletedWaitForPaint";
+          readonly generation: number;
+        } | {
+          readonly _tag: "EndedAnimation";
+          readonly generation: number;
+        } | {
+          readonly _tag: "Hid";
+        } | {
+          readonly _tag: "Showed";
+        };
+      } | {
+        readonly _tag: "RequestedClose";
+      } | {
+        readonly _tag: "RequestedOpen";
+      } | {
+        readonly _tag: "SucceededAcquireResources";
+      } | {
+        readonly _tag: "SucceededShowDialog";
+      } | {
+        readonly _tag: "Unmounted";
+      };
+    } | {
+      readonly _tag: "PressedActionKey";
+      readonly direction: "Next" | "Previous";
+    };
+  } | {
+    readonly _tag: "PressedHelpKey";
+  } | {
+    readonly _tag: "UpdatedQuery";
+    readonly value: string;
+  }, never>;
+  outMessage?: {
+    readonly _tag: "Closed";
+  };
+}>;
+/** Opens the key help, as `?` does: for a button or a command palette entry. */
+export declare const open: (model: Model) => Update.Return<Model, Message>;
+/** The key help's id, unique in the document. */
+export declare const id: (model: Model) => string;
+/** Whether the key help is open. */
+export declare const isOpen: (model: Model) => boolean;
+/** The bindings as a keymap: under their groups in the order the groups first appear, each
+ *  binding's keys printed for the platform, filtered by the query (its keys or its words). */
+export declare const toKeymapGroups: (bindings: readonly Binding[], platform: KeyPlatform, query: string) => readonly KeymapGroup[];
+/** Per-render inputs passed to `view` through `h.submodel`'s `viewInputs`. */
+export type ViewInputs = Readonly<{
+  /** Every key in force now. The help adds its own `?` line. */
+  bindings: readonly Binding[];
+  platform: KeyPlatform;
+  /** The application's own words above the find field: what the page would say that the
+   *  reader still needs while the help covers it (a sync notice and its retry). A slot that
+   *  may carry the application's handlers, so a function. */
+  toIntroView?: () => ReadonlyArray<Html | string>;
+  /** The page's live region and toasts while this is the topmost open dialog, `undefined`
+   *  while it is not (see `Dialog`). */
+  toLiveRegionView?: (() => Html) | undefined;
+}>;
+/** The keyboard's help: every key in force, under its group, with a field that finds one by
+ *  its keys or its words. `open` opens it, from `HELP_KEYS` or a button. Render it
+ *  once per page. */
+export declare const view: import("foldkit/submodel").View<{
+  readonly dialog: {
+    readonly dialog: {
+      readonly id: string;
+      readonly isOpen: boolean;
+      readonly isAnimated: boolean;
+      readonly animation: {
+        readonly id: string;
+        readonly isShowing: boolean;
+        readonly transitionState: "EnterAnimating" | "EnterStart" | "Idle" | "LeaveAnimating" | "LeaveStart";
+        readonly transitionGeneration: number;
+      };
+      readonly maybeFocusSelector: import("effect/Option").Option<string>;
+    };
+  };
+  readonly query: string;
+}, {
+  readonly _tag: "GotDialogMessage";
+  readonly message: {
+    readonly _tag: "GotDialogMessage";
+    readonly message: {
+      readonly _tag: "CompletedCloseDialog";
+    } | {
+      readonly _tag: "CompletedReleaseDialogResources";
+    } | {
+      readonly _tag: "FailedAcquireResources";
+    } | {
+      readonly _tag: "FailedShowDialog";
+    } | {
+      readonly _tag: "GotAnimationMessage";
+      readonly message: {
+        readonly _tag: "CompletedWaitForPaint";
+        readonly generation: number;
+      } | {
+        readonly _tag: "EndedAnimation";
+        readonly generation: number;
+      } | {
+        readonly _tag: "Hid";
+      } | {
+        readonly _tag: "Showed";
+      };
+    } | {
+      readonly _tag: "RequestedClose";
+    } | {
+      readonly _tag: "RequestedOpen";
+    } | {
+      readonly _tag: "SucceededAcquireResources";
+    } | {
+      readonly _tag: "SucceededShowDialog";
+    } | {
+      readonly _tag: "Unmounted";
+    };
+  } | {
+    readonly _tag: "PressedActionKey";
+    readonly direction: "Next" | "Previous";
+  };
+} | {
+  readonly _tag: "PressedHelpKey";
+} | {
+  readonly _tag: "UpdatedQuery";
+  readonly value: string;
+}, Readonly<{
+  /** Every key in force now. The help adds its own `?` line. */
+  bindings: readonly Binding[];
+  platform: KeyPlatform;
+  /** The application's own words above the find field: what the page would say that the
+   *  reader still needs while the help covers it (a sync notice and its retry). A slot that
+   *  may carry the application's handlers, so a function. */
+  toIntroView?: () => ReadonlyArray<Html | string>;
+  /** The page's live region and toasts while this is the topmost open dialog, `undefined`
+   *  while it is not (see `Dialog`). */
+  toLiveRegionView?: (() => Html) | undefined;
+}>>;

package/dist/key-help/key-help.js

@@ -0,0 +1,137 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { keyLabel, pressesOf } from "../key-hint/key-label.js";
+import { view as view$1 } from "../button/button.js";
+import { view as view$2 } from "../card/card.js";
+import { foldDialog } from "../dialog/fold.js";
+import { Message as Message$1, Model as Model$1, OutMessage as OutMessage$1, dialog_exports, id as id$1, init as init$1, isOpen as isOpen$1, view as view$3 } from "../dialog/dialog.js";
+import { view as view$4 } from "../field/field.js";
+import { view as view$5 } from "../keymap/keymap.js";
+import { Array, Predicate, Schema, String, pipe } from "effect";
+import { defineMessageUnion } from "foldkit/message";
+import { modifyFields } from "foldkit/struct";
+import { defineView } from "foldkit/submodel";
+// src/key-help/key-help.ts
+/** Schema for the key help: its Dialog and the words in its find field. */
+const Model = Schema.Struct({
+	dialog: Model$1,
+	query: Schema.String
+});
+/** The key that opens the help, `?`, which the application binds. */
+const HELP_KEYS = "Shift+?";
+/** The help's own line in its listing. */
+const helpBinding = {
+	keys: [HELP_KEYS],
+	group: "Help",
+	does: "These keys"
+};
+/** Union of all Messages the key help can produce. */
+const Message = defineMessageUnion({
+	GotDialogMessage: { message: Message$1 },
+	UpdatedQuery: { value: Schema.String },
+	PressedHelpKey: {}
+});
+/** Union of OutMessages the key help reports: the reader closed it (Escape, a click on the
+*  veil, a close button). Opening it, by `?` or `open`, reports nothing. */
+const OutMessage = defineMessageUnion({ Closed: {} });
+/** Creates the key help, closed. */
+const init = (config) => (__foldkitBrandViewResult(({
+	dialog: init$1({ id: config.id }),
+	query: ""
+}), "@gjermundgaraba/pixel-paper/key-help/key-help.js#init"));
+const toOutMessage = OutMessage$1.match({ Closed: () => __foldkitBrandViewResult((OutMessage.Closed()), "@gjermundgaraba/pixel-paper/key-help/key-help.js#Closed") });
+const dialogFold = foldDialog(dialog_exports, {
+	read: (model) => __foldkitBrandViewResult((model.dialog), "@gjermundgaraba/pixel-paper/key-help/key-help.js#read"),
+	write: (model, nextDialog) => __foldkitBrandViewResult((modifyFields(model, { dialog: () => __foldkitBrandViewResult((nextDialog), "@gjermundgaraba/pixel-paper/key-help/key-help.js#dialog") })), "@gjermundgaraba/pixel-paper/key-help/key-help.js#write"),
+	toParentMessage: (message) => __foldkitBrandViewResult((Message.GotDialogMessage({ message })), "@gjermundgaraba/pixel-paper/key-help/key-help.js#toParentMessage"),
+	toParentOutMessage: toOutMessage
+});
+const clearQuery = (model) => __foldkitBrandViewResult((modifyFields(model, { query: () => __foldkitBrandViewResult((""), "@gjermundgaraba/pixel-paper/key-help/key-help.js#query") })), "@gjermundgaraba/pixel-paper/key-help/key-help.js#clearQuery");
+/** Processes a key help Message and returns the next Model, Commands and OutMessage. */
+const update = (model, message) => __foldkitBrandViewResult((Message.match(message, {
+	GotDialogMessage: ({ message: dialogMessage }) => __foldkitBrandViewResult((dialogFold.update(model, dialogMessage)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#GotDialogMessage"),
+	UpdatedQuery: ({ value }) => (__foldkitBrandViewResult(({ model: modifyFields(model, { query: () => __foldkitBrandViewResult((value), "@gjermundgaraba/pixel-paper/key-help/key-help.js#query~2") }) }), "@gjermundgaraba/pixel-paper/key-help/key-help.js#UpdatedQuery")),
+	PressedHelpKey: () => __foldkitBrandViewResult((dialogFold.open(clearQuery(model))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#PressedHelpKey")
+})), "@gjermundgaraba/pixel-paper/key-help/key-help.js#update");
+/** Opens the key help, as `?` does: for a button or a command palette entry. */
+const open = (model) => __foldkitBrandViewResult((dialogFold.open(clearQuery(model))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#open");
+/** The key help's id, unique in the document. */
+const id = (model) => __foldkitBrandViewResult((id$1(model.dialog)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#id");
+/** Whether the key help is open. */
+const isOpen = (model) => __foldkitBrandViewResult((isOpen$1(model.dialog)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#isOpen");
+const isFound = (binding, labels, query) => __foldkitBrandViewResult((pipe([
+	labels,
+	...Array.flatMap(binding.keys, pressesOf),
+	binding.does,
+	binding.group
+], Array.join(" "), String.toLowerCase, String.includes(query))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#isFound");
+/** The bindings as a keymap: under their groups in the order the groups first appear, each
+*  binding's keys printed for the platform, filtered by the query (its keys or its words). */
+const toKeymapGroups = (bindings, platform, query) => {
+	const normalizedQuery = pipe(query, String.trim, String.toLowerCase);
+	const rows = pipe(bindings, Array.map((binding) => (__foldkitBrandViewResult(({
+		binding,
+		labels: Array.join(Array.map(binding.keys, (keys) => __foldkitBrandViewResult((keyLabel(keys, platform)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~2")), " / ")
+	}), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous"))), Array.filter(({ binding, labels }) => __foldkitBrandViewResult((isFound(binding, labels, normalizedQuery)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~3")), Array.map(({ binding, labels }) => (__foldkitBrandViewResult(({
+		group: binding.group,
+		row: {
+			keys: labels,
+			does: binding.does
+		}
+	}), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~4"))));
+	const groups = Array.dedupe(Array.map(rows, ({ group }) => __foldkitBrandViewResult((group), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~5")));
+	return __foldkitBrandViewResult((Array.map(groups, (group) => (__foldkitBrandViewResult(({
+		title: group,
+		rows: pipe(rows, Array.filter((row) => __foldkitBrandViewResult((row.group === group), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~7")), Array.map(({ row }) => __foldkitBrandViewResult((row), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~8")))
+	}), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~6")))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#toKeymapGroups");
+};
+const NOTE = "Keys wait while you type in a field.";
+const SEQUENCE_NOTE = " Type the keys of a sequence one straight after the other; any other key lets go of the first.";
+const NOTHING_FOUND = "No key does that.";
+const hasSequence = (bindings) => __foldkitBrandViewResult((Array.some(bindings, (binding) => __foldkitBrandViewResult((Array.some(binding.keys, (keys) => __foldkitBrandViewResult((!Predicate.isString(keys)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~10"))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~9"))), "@gjermundgaraba/pixel-paper/key-help/key-help.js#hasSequence");
+const cardView = (model, viewInputs, render, h) => {
+	const bindings = [...viewInputs.bindings, helpBinding];
+	const groups = toKeymapGroups(bindings, viewInputs.platform, model.query);
+	const note = Array.match(groups, {
+		onEmpty: () => __foldkitBrandViewResult((NOTHING_FOUND), "@gjermundgaraba/pixel-paper/key-help/key-help.js#onEmpty"),
+		onNonEmpty: () => __foldkitBrandViewResult((hasSequence(bindings) ? `${NOTE}${SEQUENCE_NOTE}` : NOTE), "@gjermundgaraba/pixel-paper/key-help/key-help.js#onNonEmpty")
+	});
+	return __foldkitBrandViewResult((view$2({
+		title: "Keys",
+		titleAttributes: render.title,
+		isNarrow: true,
+		closeAttributes: render.closeButton,
+		actionBarAttributes: render.actionBar,
+		actions: [view$1({
+			label: "close",
+			attributes: render.closeButton
+		}, h)],
+		body: [
+			...viewInputs.toIntroView?.() ?? [],
+			view$4({
+				id: `${id(model)}-find`,
+				label: "Find a key",
+				value: model.query,
+				onInput: (value) => __foldkitBrandViewResult((Message.UpdatedQuery({ value })), "@gjermundgaraba/pixel-paper/key-help/key-help.js#onInput"),
+				inputAttributes: render.initialFocus
+			}, h),
+			view$5({
+				groups,
+				note
+			}, h)
+		]
+	}, h)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#cardView");
+};
+/** The keyboard's help: every key in force, under its group, with a field that finds one by
+*  its keys or its words. `open` opens it, from `HELP_KEYS` or a button. Render it
+*  once per page. */
+const view = defineView((model, viewInputs, h) => __foldkitBrandViewResult((h.submodel({
+	slotId: id(model),
+	model: model.dialog,
+	view: view$3,
+	viewInputs: {
+		toLiveRegionView: viewInputs.toLiveRegionView,
+		toView: (render) => __foldkitBrandViewResult((cardView(model, viewInputs, render, h)), "@gjermundgaraba/pixel-paper/key-help/key-help.js#toView")
+	},
+	toParentMessage: (message) => __foldkitBrandViewResult((Message.GotDialogMessage({ message })), "@gjermundgaraba/pixel-paper/key-help/key-help.js#toParentMessage~2")
+})), "@gjermundgaraba/pixel-paper/key-help/key-help.js#anonymous~11"));
+export { HELP_KEYS, Message, Model, OutMessage, helpBinding, id, init, isOpen, open, toKeymapGroups, update, view };

package/dist/key-hint/index.d.ts

@@ -0,0 +1,6 @@
+import { KeyPlatform, detectKeyPlatform, keyLabel } from "./key-label.js";
+import { ViewConfig, view } from "./key-hint.js";
+declare namespace index_d_exports {
+  export { KeyPlatform, ViewConfig, detectKeyPlatform, keyLabel, view };
+}
+export { KeyPlatform, type ViewConfig, detectKeyPlatform, index_d_exports, keyLabel, view };

package/dist/key-hint/index.js

@@ -0,0 +1,12 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { __exportAll } from "../_virtual/_rolldown/runtime.js";
+import { KeyPlatform, detectKeyPlatform, keyLabel } from "./key-label.js";
+import { view } from "./key-hint.js";
+// src/key-hint/index.ts
+var key_hint_exports = /* @__PURE__ */ __exportAll({
+	KeyPlatform: () => __foldkitBrandViewResult((KeyPlatform), "@gjermundgaraba/pixel-paper/key-hint/index.js#KeyPlatform"),
+	detectKeyPlatform: () => __foldkitBrandViewResult((detectKeyPlatform), "@gjermundgaraba/pixel-paper/key-hint/index.js#detectKeyPlatform"),
+	keyLabel: () => __foldkitBrandViewResult((keyLabel), "@gjermundgaraba/pixel-paper/key-hint/index.js#keyLabel"),
+	view: () => __foldkitBrandViewResult((view), "@gjermundgaraba/pixel-paper/key-hint/index.js#view")
+});
+export { KeyPlatform, detectKeyPlatform, keyLabel, key_hint_exports, view };

package/dist/key-hint/key-hint.d.ts

@@ -0,0 +1,13 @@
+import { KeyPlatform } from "./key-label.js";
+import { Html, HtmlBuilder } from "foldkit/html";
+import { KeySequence } from "foldkit/dom";
+/** Configuration for rendering a key hint with `view`. */
+export type ViewConfig = Readonly<{
+  /** The binding's keys, as `Dom.streamFromKeyBindings` names them: `"Q"`, `"Mod+K"`,
+   *  `["G", "G"]`. */
+  keys: KeySequence;
+  platform: KeyPlatform;
+}>;
+/** A key printed small beside the words of a control, for the eye only: the control's
+ *  accessible name stays its words. */
+export declare const view: <Message>(config: ViewConfig, h: HtmlBuilder<Message>) => Html;

package/dist/key-hint/key-hint.js

@@ -0,0 +1,7 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { keyLabel } from "./key-label.js";
+// src/key-hint/key-hint.ts
+/** A key printed small beside the words of a control, for the eye only: the control's
+*  accessible name stays its words. */
+const view = (config, h) => __foldkitBrandViewResult((h.kbd([h.Class("key-hint"), h.AriaHidden(true)], [keyLabel(config.keys, config.platform)])), "@gjermundgaraba/pixel-paper/key-hint/key-hint.js#view");
+export { view };

package/dist/key-hint/key-label.d.ts

@@ -0,0 +1,18 @@
+import { Effect, Schema } from "effect";
+import { KeySequence } from "foldkit/dom";
+/** Which keyboard a key prints for: Apple's symbols (`⌘K`) or the spelled-out modifiers
+ *  everyone else reads (`Ctrl+K`). `Mod` in a binding is Meta on Apple, Control elsewhere. */
+export declare const KeyPlatform: Schema.Literals<readonly ["Apple", "Other"]>;
+export type KeyPlatform = typeof KeyPlatform.Type;
+/** The reader's key platform, from the browser's user agent (`keyPlatformOf`). `Other` where
+ *  there is no navigator, as during a server render. */
+export declare const detectKeyPlatform: Effect.Effect<KeyPlatform>;
+/**
+ * A key binding as the help and the key hints print it. Takes the same strings
+ * `Dom.streamFromKeyBindings` matches: `"Mod+K"` prints `⌘K` on Apple and `Ctrl+K` elsewhere,
+ * arrows print as arrows, a plain letter prints in lower case (`"G"` is `g`), and Shift with a
+ * lone character prints the character it types (`"Shift+G"` is `G`, `"Shift+?"` is `?`). A
+ * sequence of characters reads as Vim writes it (`["G", "G"]` is `gg`); a sequence with a
+ * named key keeps its spaces.
+ */
+export declare const keyLabel: (keys: KeySequence, platform: KeyPlatform) => string;

package/dist/key-hint/key-label.js

@@ -0,0 +1,77 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { Array, Effect, Match, Option, Predicate, Record, Schema, String, pipe } from "effect";
+// src/key-hint/key-label.ts
+/** Which keyboard a key prints for: Apple's symbols (`⌘K`) or the spelled-out modifiers
+*  everyone else reads (`Ctrl+K`). `Mod` in a binding is Meta on Apple, Control elsewhere. */
+const KeyPlatform = Schema.Literals(["Apple", "Other"]);
+const APPLE_PLATFORM_PATTERN = /Mac|iPhone|iPad|iPod/u;
+/** The key platform a user agent string names, the way `Dom.streamFromKeyBindings` resolves
+*  `Mod`, so a hint names the key the binding answers to. */
+const keyPlatformOf = (userAgent) => __foldkitBrandViewResult((APPLE_PLATFORM_PATTERN.test(userAgent) ? "Apple" : "Other"), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#keyPlatformOf");
+/** The reader's key platform, from the browser's user agent (`keyPlatformOf`). `Other` where
+*  there is no navigator, as during a server render. */
+const detectKeyPlatform = Effect.sync(() => __foldkitBrandViewResult((typeof navigator === "undefined" ? "Other" : keyPlatformOf(navigator.userAgent)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous"));
+const MODIFIER_ORDER = [
+	"Control",
+	"Alt",
+	"Shift",
+	"Meta"
+];
+const APPLE_SYMBOL = {
+	Control: "⌃",
+	Alt: "⌥",
+	Shift: "⇧",
+	Meta: "⌘"
+};
+const OTHER_PREFIX = {
+	Control: "Ctrl+",
+	Alt: "Alt+",
+	Shift: "Shift+",
+	Meta: "Meta+"
+};
+const KEY_NAMES = {
+	arrowdown: "↓",
+	arrowup: "↑",
+	arrowleft: "←",
+	arrowright: "→",
+	plus: "+",
+	space: "Space"
+};
+const toModifier = (platform) => __foldkitBrandViewResult(((token) => __foldkitBrandViewResult((Match.value(String.toLowerCase(token)).pipe(Match.withReturnType(), Match.when("mod", () => __foldkitBrandViewResult((Option.some(platform === "Apple" ? "Meta" : "Control")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~3")), Match.when("control", () => __foldkitBrandViewResult((Option.some("Control")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~4")), Match.when("alt", () => __foldkitBrandViewResult((Option.some("Alt")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~5")), Match.when("shift", () => __foldkitBrandViewResult((Option.some("Shift")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~6")), Match.when("meta", () => __foldkitBrandViewResult((Option.some("Meta")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~7")), Match.orElse(() => __foldkitBrandViewResult((Option.none()), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~8")))), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~2")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#toModifier");
+const parsePress = (press, platform) => {
+	const tokens = pipe(press, String.split("+"), Array.map(String.trim));
+	const [modifierTokens, key] = Array.unappend(tokens);
+	return __foldkitBrandViewResult(({
+		modifiers: Array.getSomes(Array.map(modifierTokens, toModifier(platform))),
+		key
+	}), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#parsePress");
+};
+const isCharacter = (key) => __foldkitBrandViewResult((key.length === 1), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#isCharacter");
+const keyName = (key, hasModifier) => __foldkitBrandViewResult((Option.match(Record.get(KEY_NAMES, String.toLowerCase(key)), {
+	onSome: (name) => __foldkitBrandViewResult((name), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#onSome"),
+	onNone: () => {
+		if (!isCharacter(key)) return __foldkitBrandViewResult((key), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#onNone");
+		else if (hasModifier) return __foldkitBrandViewResult((String.toUpperCase(key)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#onNone");
+		return __foldkitBrandViewResult((String.toLowerCase(key)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#onNone");
+	}
+})), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#keyName");
+const pressLabel = (press, platform) => {
+	const { modifiers, key } = parsePress(press, platform);
+	if (isCharacter(key) && Array.contains(modifiers, "Shift") && Array.length(modifiers) === 1) return __foldkitBrandViewResult((String.toUpperCase(key)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#pressLabel");
+	const orderedModifiers = Array.filter(MODIFIER_ORDER, (modifier) => __foldkitBrandViewResult((Array.contains(modifiers, modifier)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~9"));
+	return __foldkitBrandViewResult((`${Array.join(Array.map(orderedModifiers, (modifier) => __foldkitBrandViewResult((platform === "Apple" ? APPLE_SYMBOL[modifier] : OTHER_PREFIX[modifier]), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~10")), "")}${keyName(key, Array.isReadonlyArrayNonEmpty(orderedModifiers))}`), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#pressLabel");
+};
+const pressesOf = (keys) => __foldkitBrandViewResult((Predicate.isString(keys) ? [keys] : keys), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#pressesOf");
+/**
+* A key binding as the help and the key hints print it. Takes the same strings
+* `Dom.streamFromKeyBindings` matches: `"Mod+K"` prints `⌘K` on Apple and `Ctrl+K` elsewhere,
+* arrows print as arrows, a plain letter prints in lower case (`"G"` is `g`), and Shift with a
+* lone character prints the character it types (`"Shift+G"` is `G`, `"Shift+?"` is `?`). A
+* sequence of characters reads as Vim writes it (`["G", "G"]` is `gg`); a sequence with a
+* named key keeps its spaces.
+*/
+const keyLabel = (keys, platform) => {
+	const labels = Array.map(pressesOf(keys), (press) => __foldkitBrandViewResult((pressLabel(press, platform)), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#anonymous~11"));
+	return __foldkitBrandViewResult((Array.every(labels, isCharacter) ? Array.join(labels, "") : Array.join(labels, " ")), "@gjermundgaraba/pixel-paper/key-hint/key-label.js#keyLabel");
+};
+export { KeyPlatform, detectKeyPlatform, keyLabel, keyPlatformOf, pressesOf };

package/dist/keymap/keymap.d.ts

@@ -0,0 +1,11 @@
+import { Html, HtmlBuilder } from "foldkit/html";
+/** One key and what it does, both as printed. */
+export type KeymapRow = Readonly<{
+  keys: string;
+  does: string;
+}>;
+/** A heading and the keys under it. */
+export type KeymapGroup = Readonly<{
+  title: string;
+  rows: readonly KeymapRow[];
+}>;

package/dist/keymap/keymap.js

@@ -0,0 +1,9 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { Array } from "effect";
+// src/keymap/keymap.ts
+const rowView = (h) => __foldkitBrandViewResult((({ keys, does }) => __foldkitBrandViewResult((h.keyed("div")(keys, [h.Class("keymap-row")], [h.kbd([], [keys]), h.span([], [does])])), "@gjermundgaraba/pixel-paper/keymap/keymap.js#anonymous")), "@gjermundgaraba/pixel-paper/keymap/keymap.js#rowView");
+const groupView = (h) => __foldkitBrandViewResult((({ title, rows }) => __foldkitBrandViewResult((h.keyed("div")(title, [], [h.h3([], [title]), ...Array.map(rows, rowView(h))])), "@gjermundgaraba/pixel-paper/keymap/keymap.js#anonymous~2")), "@gjermundgaraba/pixel-paper/keymap/keymap.js#groupView");
+/** Keys and what they do, grouped under `h3` headings, each key in a `kbd`, in the pixel
+*  face. Sits in a narrow Card. */
+const view = (config, h) => __foldkitBrandViewResult((h.div([h.Class("keymap")], [...Array.map(config.groups, groupView(h)), ...config.note === void 0 ? [] : [h.p([h.Class("note-line")], [config.note])]])), "@gjermundgaraba/pixel-paper/keymap/keymap.js#view");
+export { view };

package/dist/keys/keys.js

@@ -0,0 +1,4 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+// src/keys/keys.ts
+const isPlain = (event) => __foldkitBrandViewResult((!event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey), "@gjermundgaraba/pixel-paper/keys/keys.js#isPlain");
+export { isPlain };

package/dist/line-diff/diff.d.ts

@@ -0,0 +1,2 @@
+import { Array, Option, Schema } from "effect";
+import "diff";

package/dist/line-diff/diff.js

@@ -0,0 +1,73 @@
+import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
+import { Array, Match, Option, Record, Schema } from "effect";
+import { defineTaggedUnion } from "foldkit/schema";
+import { parsePatch } from "diff";
+// src/line-diff/diff.ts
+const DiffRow = defineTaggedUnion({
+	Same: {
+		text: Schema.String,
+		oldNumber: Schema.Finite,
+		newNumber: Schema.Finite
+	},
+	Added: {
+		text: Schema.String,
+		newNumber: Schema.Finite
+	},
+	Removed: {
+		text: Schema.String,
+		oldNumber: Schema.Finite
+	},
+	Fold: {
+		count: Schema.Finite,
+		firstOldNumber: Schema.Finite
+	}
+});
+const numberLine = (numbers, kind, text) => __foldkitBrandViewResult((Match.value(kind).pipe(Match.withReturnType(), Match.when("Same", () => __foldkitBrandViewResult(([{
+	old: numbers.old + 1,
+	new: numbers.new + 1
+}, DiffRow.Same({
+	text,
+	oldNumber: numbers.old,
+	newNumber: numbers.new
+})]), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous")), Match.when("Added", () => __foldkitBrandViewResult(([{
+	old: numbers.old,
+	new: numbers.new + 1
+}, DiffRow.Added({
+	text,
+	newNumber: numbers.new
+})]), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~2")), Match.when("Removed", () => __foldkitBrandViewResult(([{
+	old: numbers.old + 1,
+	new: numbers.new
+}, DiffRow.Removed({
+	text,
+	oldNumber: numbers.old
+})]), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~3")), Match.exhaustive)), "@gjermundgaraba/pixel-paper/line-diff/diff.js#numberLine");
+const numbered = (lines, from) => __foldkitBrandViewResult((Array.mapAccum(lines, from, (numbers, { kind, text }) => __foldkitBrandViewResult((numberLine(numbers, kind, text)), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~4"))), "@gjermundgaraba/pixel-paper/line-diff/diff.js#numbered");
+const LINE_KIND_BY_PREFIX = {
+	" ": "Same",
+	"+": "Added",
+	"-": "Removed"
+};
+const kindOf = (line) => __foldkitBrandViewResult((line === "" ? Option.some("Same") : Record.get(LINE_KIND_BY_PREFIX, line.charAt(0))), "@gjermundgaraba/pixel-paper/line-diff/diff.js#kindOf");
+const linesOf = (hunk) => __foldkitBrandViewResult((Array.getSomes(Array.map(hunk.lines, (line) => __foldkitBrandViewResult((Option.map(kindOf(line), (kind) => (__foldkitBrandViewResult(({
+	kind,
+	text: line.slice(1)
+}), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~6")))), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~5")))), "@gjermundgaraba/pixel-paper/line-diff/diff.js#linesOf");
+const readHunk = (nextOld, hunk) => {
+	const gap = hunk.oldStart - nextOld;
+	const [end, rows] = numbered(linesOf(hunk), {
+		old: hunk.oldStart,
+		new: hunk.newStart
+	});
+	return __foldkitBrandViewResult(([end.old, gap > 0 ? [DiffRow.Fold({
+		count: gap,
+		firstOldNumber: nextOld
+	}), ...rows] : rows]), "@gjermundgaraba/pixel-paper/line-diff/diff.js#readHunk");
+};
+const onlyHunksOf = (files) => __foldkitBrandViewResult((Array.match(files, {
+	onEmpty: () => __foldkitBrandViewResult((Option.none()), "@gjermundgaraba/pixel-paper/line-diff/diff.js#onEmpty"),
+	onNonEmpty: ([file, ...others]) => __foldkitBrandViewResult((Array.isArrayEmpty(others) && Array.isArrayNonEmpty(file.hunks) ? Option.some(file.hunks) : Option.none()), "@gjermundgaraba/pixel-paper/line-diff/diff.js#onNonEmpty")
+})), "@gjermundgaraba/pixel-paper/line-diff/diff.js#onlyHunksOf");
+const hunksOfPatch = (patch) => __foldkitBrandViewResult((Option.flatMap(Option.liftThrowable(parsePatch)(patch), onlyHunksOf)), "@gjermundgaraba/pixel-paper/line-diff/diff.js#hunksOfPatch");
+const diffRowsOfPatch = (patch) => __foldkitBrandViewResult((Option.map(hunksOfPatch(patch), (hunks) => __foldkitBrandViewResult((Array.flatten(Array.mapAccum(hunks, 1, readHunk)[1])), "@gjermundgaraba/pixel-paper/line-diff/diff.js#anonymous~7"))), "@gjermundgaraba/pixel-paper/line-diff/diff.js#diffRowsOfPatch");
+export { DiffRow, diffRowsOfPatch, hunksOfPatch };

package/dist/line-diff/index.d.ts

@@ -0,0 +1,6 @@
+import { PatchViewConfig, patchView } from "./line-diff.js";
+import { describePatch } from "./patch.js";
+declare namespace index_d_exports {
+  export { PatchViewConfig, describePatch, patchView };
+}
+export { type PatchViewConfig, describePatch, index_d_exports, patchView };