@rydr/game-sdk 7.1.0 → 8.0.0

package/dist/ui/{pause-menu.js → option-menu.js}

@@ -1,14 +1,14 @@
 /**
- * PAUSE MENU — the in-game menu every RYDR game shares, opened by the game's own `OPTIONS` button.
+ * OPTION MENU — the in-game menu every RYDR game shares, opened by the game's own `OPTIONS` button.
  *
  * This is the GAME's menu, deliberately distinct from the PLATFORM's overlay (which the shell opens on
  * `MENU` / `M` / phone MENU and which never reaches a game — see `ButtonName`). The platform overlay
  * carries the rider's concerns: activity, hardware, volume, exit. This one carries the *game's*:
  * resume, restart, back to your own menu. It deliberately quotes the platform overlay's visual language
- * — dim + blurred backdrop, frosted rows, the staggered "warp" entrance — so pause reads as a RYDR
+ * — dim + blurred backdrop, frosted rows, the staggered "warp" entrance — so it reads as a RYDR
  * surface one level shallower than the platform's, rather than as a second, unrelated menu.
  *
- *   const pause = mountPauseMenu(document.body, {
+ *   const menu = mountOptionMenu(document.body, {
  *     session,
  *     title: "Split Racing",
  *     canOpen: () => phase === "playing",     // the game decides WHEN it may open
@@ -23,28 +23,40 @@
  * `Resume` is prepended for free, so the shortest useful menu is no items at all.
  *
  * **Everything the rider reads is in the GAME's font.** The title and every row inherit the host's
- * font-family (override with the `font` option or the `--rydr-pause-font` custom property), because
+ * font-family (override with the `font` option or the `--rydr-option-font` custom property), because
  * this menu belongs to the game, not to the shell — the one exception being the keycaps, which keep
  * their standard RYDR type because they are pictures of the rider's physical controller.
  *
+ * Inheritance being the mechanism, the host page has to actually DECLARE a font: with nothing setting
+ * `font-family` up the tree, this renders in the browser default (Times). Every real game sets a body
+ * font, so it costs nothing — but a menu that looks like a legal document is that, not a bug here.
+ *
  * **What it does NOT do: stop your game.** No library can — your loop, timers and physics are yours.
  * The menu tells you when it opens and closes; freeze there. What it *does* guarantee is that a game
  * which keeps running cannot be *driven* while the rider is in the menu: it takes the controller over
  * for the duration (`session.grabInput`), so your `onButton` handlers go quiet, `isDown`/`stick` read
- * resting, and anything held is released first. It also declares `"menu"` to the shell while it's up,
- * so trainer resistance eases like on any other non-racing screen, and restores `"playing"` on resume.
+ * resting, and anything held is released first.
+ *
+ * **It also does NOT touch the trainer.** Opening this menu leaves the activity state exactly as the
+ * game left it — a rider who opens it mid-run keeps the resistance they were riding. That is
+ * deliberate: this menu is a transient overlay over LIVE gameplay, not a screen the rider navigated
+ * to, and they are still on the bike with their legs turning. Dropping to the eased menu resistance
+ * and snapping back on `Resume` would change the difficulty of the very run they are deciding
+ * whether to restart. (Contrast the PLATFORM overlay, which is the shell's own and does ease.)
+ * A game that genuinely wants easing here can still do it itself in `onOpen`/`onClose` —
+ * `session.setActivity("menu")` / `("playing")` — which is more flexible than an option anyway.
  *
  * A row may advertise a `shortcut` — the button the rider can press *in-game* to do the same thing
  * (`Restart · Shortcut [Y]`). Binding that shortcut during play stays the game's own job; the menu
  * only teaches it, and honours it while the menu itself is open (where it owns input anyway).
  */
-import { DEFAULT_GLYPH_SET } from "../protocol/glyphs.js";
+import { DEFAULT_GLYPH_SET, isDiamondButton } from "../protocol/glyphs.js";
 import { createSpatialNav } from "../nav/spatial-nav.js";
-import { createKeycap, createLabelKeycap } from "./keycap.js";
+import { createKeycap, createDpadKeycap, createButtonKeycap, } from "./keycap.js";
 import { injectCss } from "./styles.js";
 /**
  * The rider's controller lettering: an explicit `glyphSet` wins, else the one a real `PlatformSession`
- * carries, else Xbox. Probed structurally rather than declared on {@link PauseMenuSession} — same
+ * carries, else Xbox. Probed structurally rather than declared on {@link OptionMenuSession} — same
  * reasoning as `createKeycap`'s own probe: that type is the *minimal* slice the menu needs, and
  * demanding a hardware snapshot would break every hand-rolled stub for a value that's optional anyway.
  */
@@ -54,31 +66,54 @@ function resolveGlyphSet(opts) {
     const probe = opts.session;
     return probe?.hardware?.current?.glyphSet ?? DEFAULT_GLYPH_SET;
 }
+/** The d-pad directions, for {@link shortcutKeycap}'s shape choice. */
+const DIRECTIONS = ["UP", "DOWN", "LEFT", "RIGHT"];
+/** Shortcut caps ride at 65% — secondary to the full-size confirm cap. See {@link shortcutKeycap}. */
+const SHORTCUT_CAP_SCALE = 0.65;
+/**
+ * A keycap for a row's shortcut, drawn as the REAL button: a face-diamond button gets its lettered pip
+ * (`Y` / `△` / `X`), a direction gets its chevron pip, and everything else — the options button, the
+ * triggers, the stick clicks — goes to `createButtonKeycap`, which picks the pad's icon pip or a text
+ * pill as appropriate. Routing here rather than sending everything to one factory is what keeps a
+ * `Restart [Y]` row printing the same key the rest of RYDR prints for that button.
+ */
+function shortcutKeycap(button, press, glyphSet) {
+    // Mono (the keycap default): a white face with a dark letter, as everywhere else in RYDR. Never the
+    // per-button hues — a coloured pip here would be the one loud key on the screen. And SMALL: this is a
+    // hint the rider may take, sitting beside the label, so it must not compete with the confirm cap that
+    // says what to press right now (`scale`, not a transform — see KeycapOptions.scale).
+    const opts = { press, glyphSet, animate: false, variant: "solo", scale: SHORTCUT_CAP_SCALE };
+    if (isDiamondButton(button))
+        return createKeycap(button, opts);
+    if (DIRECTIONS.includes(button))
+        return createDpadKeycap(button, opts);
+    return createButtonKeycap(button, opts);
+}
 /** Entrance/exit duration + per-row stagger, mirrored in the CSS below. */
 const ANIM_MS = 500;
 const STAGGER_MS = 26;
 /** Rows warp outward this fraction of their distance from the list's centre. */
 const WARP_PUSH = 0.9;
-let pauseCssInjected = false;
-function injectPauseCss() {
-    if (pauseCssInjected || document.getElementById("rydr-pause-css")) {
-        pauseCssInjected = true;
+let optionCssInjected = false;
+function injectOptionCss() {
+    if (optionCssInjected || document.getElementById("rydr-option-css")) {
+        optionCssInjected = true;
         return;
     }
     const style = document.createElement("style");
-    style.id = "rydr-pause-css";
+    style.id = "rydr-option-css";
     style.textContent = CSS;
     document.head.appendChild(style);
-    pauseCssInjected = true;
+    optionCssInjected = true;
 }
 /**
- * Mount the pause menu (hidden until opened). Appended to `host` — normally `document.body`, so the
+ * Mount the option menu (hidden until opened). Appended to `host` — normally `document.body`, so the
  * overlay covers the game whatever the DOM under it looks like.
  */
-export function mountPauseMenu(host, opts) {
+export function mountOptionMenu(host, opts) {
     injectCss(); // the keycaps' own .rydr-ui-* styles
-    injectPauseCss();
-    const { session, openButton = "OPTIONS", resumeLabel = "Resume", activity = true, captureInput = true, cue, } = opts;
+    injectOptionCss();
+    const { session, openButton = "OPTIONS", resumeLabel = "Resume", captureInput = true, cue, } = opts;
     const glyphSet = resolveGlyphSet(opts);
     let items = opts.items ? [...opts.items] : [];
     let open = false;
@@ -94,17 +129,17 @@ export function mountPauseMenu(host, opts) {
     let rowCaps = [];
     // ── DOM ────────────────────────────────────────────────────────────────────────────────────────
     const root = document.createElement("div");
-    root.className = "rydr-pause";
+    root.className = "rydr-option";
     root.tabIndex = -1;
     if (opts.font)
-        root.style.setProperty("--rydr-pause-font", opts.font);
+        root.style.setProperty("--rydr-option-font", opts.font);
     const inner = document.createElement("div");
-    inner.className = "rydr-pause-inner";
+    inner.className = "rydr-option-inner";
     const titleEl = document.createElement("div");
-    titleEl.className = "rydr-pause-title";
+    titleEl.className = "rydr-option-title";
     titleEl.textContent = opts.title;
     const listEl = document.createElement("div");
-    listEl.className = "rydr-pause-list";
+    listEl.className = "rydr-option-list";
     inner.append(titleEl, listEl);
     root.appendChild(inner);
     host.appendChild(root);
@@ -133,12 +168,11 @@ export function mountPauseMenu(host, opts) {
      */
     const confirmCap = createKeycap("DIAMOND_DOWN", {
         variant: "solo",
-        colored: false,
         animate: true,
         press: capSource,
         glyphSet,
     });
-    confirmCap.el.classList.add("rydr-pause-cap");
+    confirmCap.el.classList.add("rydr-option-cap");
     // ── Rows ───────────────────────────────────────────────────────────────────────────────────────
     function buildRows() {
         for (const cap of rowCaps)
@@ -149,43 +183,49 @@ export function mountPauseMenu(host, opts) {
         rows = rowItems.map((item, i) => {
             const row = document.createElement("button");
             row.type = "button";
-            row.className = "rydr-pause-row" + (item.danger ? " danger" : "");
+            row.className = "rydr-option-row" + (item.danger ? " danger" : "");
             if (item.disabled)
                 row.disabled = true;
             row.style.setProperty("--i", String(i));
             row.style.setProperty("--ri", String(rowItems.length - 1 - i));
             const text = document.createElement("span");
-            text.className = "rydr-pause-text";
+            text.className = "rydr-option-text";
             const label = document.createElement("span");
-            label.className = "rydr-pause-label";
+            label.className = "rydr-option-label";
             label.textContent = item.label;
             text.appendChild(label);
             if (item.hint) {
                 const hint = document.createElement("span");
-                hint.className = "rydr-pause-hint";
+                hint.className = "rydr-option-hint";
                 hint.textContent = item.hint;
                 text.appendChild(hint);
             }
             row.appendChild(text);
-            const right = document.createElement("span");
-            right.className = "rydr-pause-right";
+            // The shortcut sits INLINE, immediately right of the text — a sibling of it in the row, not a
+            // line of its own under the label. Two things fall out of that: a row is one line tall again
+            // (the list reads as a list rather than a stack of two-line blocks), and the chip is anchored to
+            // the label it belongs to rather than to the row's right edge, where a column of keys detached
+            // from their words reads as unrelated hardware. It follows the label's WIDTH, so the chips do
+            // not line up down the list — that's the cost of belonging to the text.
             if (item.shortcut) {
                 const shortcut = document.createElement("span");
-                shortcut.className = "rydr-pause-shortcut";
+                shortcut.className = "rydr-option-shortcut";
                 const tag = document.createElement("span");
-                tag.className = "rydr-pause-shortcut-tag";
+                tag.className = "rydr-option-shortcut-tag";
                 tag.textContent = "Shortcut";
-                const cap = createLabelKeycap(item.shortcut, { press: capSource, glyphSet });
+                const cap = shortcutKeycap(item.shortcut, capSource, glyphSet);
                 rowCaps.push(cap);
                 if (item.disabled)
                     cap.setDisabled(true);
                 shortcut.append(tag, cap.el);
-                right.appendChild(shortcut);
+                row.appendChild(shortcut);
             }
+            const right = document.createElement("span");
+            right.className = "rydr-option-right";
             // The slot the confirm keycap moves into when this row takes focus. Always present (and always
             // the same width) so focus moving between rows never reflows the list.
             const slot = document.createElement("span");
-            slot.className = "rydr-pause-confirm";
+            slot.className = "rydr-option-confirm";
             right.appendChild(slot);
             row.appendChild(right);
             row.addEventListener("click", () => select(i));
@@ -209,7 +249,7 @@ export function mountPauseMenu(host, opts) {
     /** Move the confirm keycap into the focused row's slot (out of the DOM when nothing is focused). */
     function placeCap() {
         const row = open ? nav?.current() ?? null : null;
-        const slot = row?.querySelector(".rydr-pause-confirm");
+        const slot = row?.querySelector(".rydr-option-confirm");
         if (!slot) {
             confirmCap.el.remove();
             return;
@@ -291,13 +331,13 @@ export function mountPauseMenu(host, opts) {
         computeOffsets();
         if (captureInput && session?.grabInput)
             releaseInput = session.grabInput(onEdge);
-        if (activity)
-            session?.setActivity?.("menu");
+        // Note what is NOT here: an activity change. The rider keeps the resistance they were riding —
+        // see the header. Input is taken over; the trainer is left alone.
         // Pull keyboard focus onto the overlay so a game that also handles DOM focus can't keep it.
         root.focus?.();
         nav = createSpatialNav({
             root: listEl,
-            selector: ".rydr-pause-row:not([disabled])",
+            selector: ".rydr-option-row:not([disabled])",
             ring: false, // the ring is styled below
             wrap: true, // a single-axis list: DOWN past the last returns to the first
             pointer: true, // hover and controller share one focus state
@@ -323,8 +363,6 @@ export function mountPauseMenu(host, opts) {
         root.classList.add("closing");
         releaseInput?.();
         releaseInput = null;
-        if (activity)
-            session?.setActivity?.("playing");
         nav?.dispose();
         nav = null;
         // The cap leaves with the focus ring, but the rows stay mounted for the warp-out.
@@ -372,10 +410,8 @@ export function mountPauseMenu(host, opts) {
             offSession?.();
             releaseInput?.();
             releaseInput = null;
-            // Torn down mid-open (a game unmounting its screen): hand the trainer back to gameplay, or the
-            // rider would keep riding the menu's eased resistance with no menu on screen.
-            if (open && activity)
-                session?.setActivity?.("playing");
+            // Nothing to restore on the trainer: opening never changed it. Releasing the input grab above
+            // is the whole of the cleanup a mid-open teardown needs.
             open = false;
             if (closeTimer !== null)
                 clearTimeout(closeTimer);
@@ -391,110 +427,118 @@ export function mountPauseMenu(host, opts) {
     };
 }
 /**
- * The overlay's own `.rydr-pause-*` CSS — self-contained, injected once, no global styles or CSS
+ * The overlay's own `.rydr-option-*` CSS — self-contained, injected once, no global styles or CSS
  * variables required. Deliberately quotes the platform menu's numbers (the same dim, blur, radii and
  * warp curve) so the two surfaces read as one family.
  *
- * `font-family: var(--rydr-pause-font, inherit)` on every text rule is load-bearing: the menu must
+ * `font-family: var(--rydr-option-font, inherit)` on every text rule is load-bearing: the menu must
  * render in the GAME's font, which it gets by inheriting from the host. The keycaps are the exception —
  * they carry their own type from `styles.ts`, because they depict the rider's physical controller.
  */
 const CSS = `
-.rydr-pause { position: fixed; inset: 0; z-index: 1400; display: flex; justify-content: center;
+.rydr-option { position: fixed; inset: 0; z-index: 1400; display: flex; justify-content: center;
           overflow-x: hidden; overflow-y: auto; padding: clamp(40px, 7vh, 88px) 24px 96px;
-          font-family: var(--rydr-pause-font, inherit);
+          font-family: var(--rydr-option-font, inherit);
           background: rgba(2, 6, 23, calc(0.82 * var(--bd, 0)));
           -webkit-backdrop-filter: blur(calc(14px * var(--bd, 0)));
                   backdrop-filter: blur(calc(14px * var(--bd, 0)));
           opacity: 0; pointer-events: none; visibility: hidden;
           transition: background 0.45s ease, backdrop-filter 0.45s ease, opacity 0.35s ease; }
-.rydr-pause:focus { outline: none; }
-.rydr-pause.open { opacity: 1; pointer-events: auto; visibility: visible; --bd: 1; }
+.rydr-option:focus { outline: none; }
+.rydr-option.open { opacity: 1; pointer-events: auto; visibility: visible; --bd: 1; }
 /* closing: stay visible so the rows can warp back out — only the backdrop fades */
-.rydr-pause.closing { opacity: 1; visibility: visible; pointer-events: none; --bd: 0;
+.rydr-option.closing { opacity: 1; visibility: visible; pointer-events: none; --bd: 0;
           transition: background 0.45s ease, backdrop-filter 0.45s ease; }
 
-.rydr-pause-inner { width: 100%; max-width: 620px; margin: auto 0; display: flex; flex-direction: column; gap: 26px; }
+.rydr-option-inner { width: 100%; max-width: 620px; margin: auto 0; display: flex; flex-direction: column; gap: 26px; }
 /* the game's name, in the game's font — the biggest thing on the screen */
-.rydr-pause-title { font-family: var(--rydr-pause-font, inherit); text-align: center;
+.rydr-option-title { font-family: var(--rydr-option-font, inherit); text-align: center;
           font-size: clamp(2.4rem, 8vw, 3.4rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1;
           color: #f2f5fb; text-shadow: 0 6px 30px rgba(0, 0, 0, 0.6); }
-.rydr-pause-list { position: relative; display: flex; flex-direction: column; gap: 12px; }
+.rydr-option-list { position: relative; display: flex; flex-direction: column; gap: 12px; }
 
-/* a row: frosted glass, label left, shortcut right */
-.rydr-pause-row { appearance: none; cursor: pointer; width: 100%; box-sizing: border-box;
-          display: flex; align-items: center; justify-content: space-between; gap: 18px;
-          min-height: 74px; padding: 0.9rem 1.1rem 0.9rem 1.4rem; border-radius: 18px;
-          font-family: var(--rydr-pause-font, inherit); color: #f2f5fb; text-align: left;
+/* a row: frosted glass; the label (with the hint under it) then the shortcut chip beside it, and the
+   confirm cap's slot pinned to the right.
+   Packed from the LEFT (not space-between) so the shortcut lands against the text it belongs to; the
+   slot is pushed to the far edge by its own auto margin instead. */
+.rydr-option-row { appearance: none; cursor: pointer; width: 100%; box-sizing: border-box;
+          display: flex; align-items: center; justify-content: flex-start; gap: 18px;
+          min-height: 86px; padding: 0.9rem 1.1rem 0.9rem 1.4rem; border-radius: 18px;
+          font-family: var(--rydr-option-font, inherit); color: #f2f5fb; text-align: left;
           background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14);
           -webkit-backdrop-filter: blur(20px) saturate(120%);
                   backdrop-filter: blur(20px) saturate(120%);
           box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08);
           transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, background 0.14s ease;
           will-change: transform, opacity, filter; }
-.rydr-pause-row:hover:not([disabled]) { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.3); }
-.rydr-pause-row:focus-visible { outline: none; }
-.rydr-pause-row[disabled] { cursor: default; opacity: 0.45; }
-.rydr-pause-row.danger .rydr-pause-label { color: #ff8b8b; }
-.rydr-pause-text { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
-.rydr-pause-label { font-family: var(--rydr-pause-font, inherit); font-weight: 700; font-size: 1.6rem;
+.rydr-option-row:hover:not([disabled]) { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.3); }
+.rydr-option-row:focus-visible { outline: none; }
+.rydr-option-row[disabled] { cursor: default; opacity: 0.45; }
+.rydr-option-row.danger .rydr-option-label { color: #ff8b8b; }
+/* the left column: the label, with the hint under it (the shortcut is a sibling of this, inline) */
+.rydr-option-text { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; min-width: 0; }
+.rydr-option-label { font-family: var(--rydr-option-font, inherit); font-weight: 700; font-size: 1.6rem;
           letter-spacing: 0.01em; line-height: 1.1; overflow-wrap: anywhere; }
-.rydr-pause-hint { font-family: var(--rydr-pause-font, inherit); font-size: 0.95rem; font-weight: 500;
+.rydr-option-hint { font-family: var(--rydr-option-font, inherit); font-size: 0.95rem; font-weight: 500;
           color: rgba(238, 244, 255, 0.62); line-height: 1.25; }
-/* right side: the "Shortcut" tag + its keycap, then the slot the confirm cap rides into */
-.rydr-pause-right { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; }
-.rydr-pause-shortcut { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
-.rydr-pause-shortcut-tag { font-family: var(--rydr-pause-font, inherit); font-size: 0.7rem; font-weight: 700;
+/* right side: only the slot the confirm cap rides into. The auto left margin is what pins it to the far
+   edge now that the row packs from the left — it eats all the free space, so nothing before it moves.
+   (No backticks in here: this comment sits inside a template literal, where one would end the literal
+   and break every rule after it.) */
+.rydr-option-right { display: flex; align-items: center; flex: 0 0 auto; margin-left: auto; }
+/* the shortcut chip, inline beside the text: the "SHORTCUT" tag + that button's own keycap */
+.rydr-option-shortcut { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
+.rydr-option-shortcut-tag { font-family: var(--rydr-option-font, inherit); font-size: 0.7rem; font-weight: 700;
           letter-spacing: 0.14em; text-transform: uppercase; color: rgba(238, 244, 255, 0.5); }
 /* the slot is always there, at a FIXED width (one solo keycap), so focus moving row to row can never
    reflow the list — only the cap inside it appears and disappears */
-.rydr-pause-confirm { flex: 0 0 38px; height: 38px; display: flex; align-items: center; justify-content: center; }
+.rydr-option-confirm { flex: 0 0 38px; height: 38px; display: flex; align-items: center; justify-content: center; }
 
 /* roving controller focus: white ring + halo, as on the platform overlay */
-.rydr-pause-row[nav-focused] { outline: none; transform: scale(1.02);
+.rydr-option-row[nav-focused] { outline: none; transform: scale(1.02);
           border-color: rgba(255, 255, 255, 0.9);
           box-shadow: 0 0 0 3px #ffffff, 0 0 22px 0 rgba(255, 255, 255, 0.16), 0 22px 50px rgba(0, 0, 0, 0.55);
           z-index: 2; }
 
 /* the confirm keycap, sitting in the focused row's slot */
-.rydr-pause-cap { pointer-events: none;
+.rydr-option-cap { pointer-events: none;
           filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.7)) drop-shadow(0 8px 16px rgba(0, 0, 0, 0.5)); }
 
 /* ── entrance / exit: rows warp in from their own side of the list, staggered ──
    fill: backwards (not both) so the resting frame hands control back to plain CSS and the
    [nav-focused] scale can take over without a flash. */
-.rydr-pause.open .rydr-pause-row { animation: rydr-pause-warp-in ${ANIM_MS}ms cubic-bezier(0.1, 0.8, 0.4, 1) backwards;
+.rydr-option.open .rydr-option-row { animation: rydr-option-warp-in ${ANIM_MS}ms cubic-bezier(0.1, 0.8, 0.4, 1) backwards;
           animation-delay: calc(var(--ri, 0) * ${STAGGER_MS}ms); }
-.rydr-pause.open .rydr-pause-title { animation: rydr-pause-warp-in-top ${ANIM_MS}ms cubic-bezier(0.1, 0.8, 0.4, 1) backwards; }
-.rydr-pause.closing .rydr-pause-row { animation: rydr-pause-warp-out ${ANIM_MS}ms cubic-bezier(0.6, 0, 0.9, 0.2) both;
+.rydr-option.open .rydr-option-title { animation: rydr-option-warp-in-top ${ANIM_MS}ms cubic-bezier(0.1, 0.8, 0.4, 1) backwards; }
+.rydr-option.closing .rydr-option-row { animation: rydr-option-warp-out ${ANIM_MS}ms cubic-bezier(0.6, 0, 0.9, 0.2) both;
           animation-delay: calc(var(--i, 0) * ${STAGGER_MS}ms); }
-.rydr-pause.closing .rydr-pause-title { animation: rydr-pause-warp-out-top ${ANIM_MS}ms cubic-bezier(0.6, 0, 0.9, 0.2) both; }
-@keyframes rydr-pause-warp-in {
+.rydr-option.closing .rydr-option-title { animation: rydr-option-warp-out-top ${ANIM_MS}ms cubic-bezier(0.6, 0, 0.9, 0.2) both; }
+@keyframes rydr-option-warp-in {
   0%   { opacity: 0; transform: translateY(calc(var(--dy, 0px) * 1.5)) scale(2.4); filter: blur(6px); }
   55%  { opacity: 1; filter: blur(0); }
   100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
 }
-@keyframes rydr-pause-warp-out {
+@keyframes rydr-option-warp-out {
   0%   { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
   45%  { opacity: 1; filter: blur(0); }
   100% { opacity: 0; transform: translateY(calc(var(--dy, 0px) * 1.5)) scale(2.4); filter: blur(6px); }
 }
-@keyframes rydr-pause-warp-in-top {
+@keyframes rydr-option-warp-in-top {
   0%   { opacity: 0; transform: translateY(-70px) scale(1.9); filter: blur(6px); }
   55%  { opacity: 1; filter: blur(0); }
   100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
 }
-@keyframes rydr-pause-warp-out-top {
+@keyframes rydr-option-warp-out-top {
   0%   { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
   45%  { opacity: 1; filter: blur(0); }
   100% { opacity: 0; transform: translateY(-70px) scale(1.9); filter: blur(6px); }
 }
 @media (prefers-reduced-motion: reduce) {
-  .rydr-pause.open .rydr-pause-row,
-  .rydr-pause.open .rydr-pause-title { animation: rydr-pause-fade 0.3s ease both !important; }
-  .rydr-pause.closing .rydr-pause-row,
-  .rydr-pause.closing .rydr-pause-title { animation: rydr-pause-fade 0.2s ease reverse both !important; }
-  @keyframes rydr-pause-fade { from { opacity: 0; } to { opacity: 1; } }
+  .rydr-option.open .rydr-option-row,
+  .rydr-option.open .rydr-option-title { animation: rydr-option-fade 0.3s ease both !important; }
+  .rydr-option.closing .rydr-option-row,
+  .rydr-option.closing .rydr-option-title { animation: rydr-option-fade 0.2s ease reverse both !important; }
+  @keyframes rydr-option-fade { from { opacity: 0; } to { opacity: 1; } }
 }
 `;
-//# sourceMappingURL=pause-menu.js.map
+//# sourceMappingURL=option-menu.js.map

package/dist/ui/option-menu.js.map

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

package/dist/ui/showcase/index.js

@@ -12,7 +12,7 @@
  * components never pulls the catalog into its bundle. Pass a real `session` for live watts + real
  * button reflection; omit it and the catalog renders static.
  */
-import { createKeycap, createDpadKeycap, mountCard, mountActionCard, mountActionDiamond, mountDialogueCard, mountChoiceCard, mountLabeledDiamond, mountSoloLabeledDiamond, mountRarityCard, mountPauseMenu, createPowerRace, mountControllerPad, mountControllerMap, mountComboDemo, mountControlTrainer, createInputChip, RARITY, } from "../index.js";
+import { createKeycap, createDpadKeycap, mountCard, mountActionCard, mountActionDiamond, mountDialogueCard, mountChoiceCard, mountLabeledDiamond, mountSoloLabeledDiamond, mountRarityCard, mountOptionMenu, createPowerRace, mountControllerPad, mountControllerMap, mountComboDemo, mountControlTrainer, createInputChip, RARITY, } from "../index.js";
 import { Gallery, el, makeCanvas } from "./gallery.js";
 const FACES = ["DIAMOND_DOWN", "DIAMOND_LEFT", "DIAMOND_UP", "DIAMOND_RIGHT"];
 const DIRS = ["UP", "RIGHT", "DOWN", "LEFT"];
@@ -88,7 +88,7 @@ export function mountUiShowcase(host, opts = {}) {
     const ftp = session?.identity.ftp ?? 250;
     let race;
     let raceHideT = 0;
-    let pause;
+    let optionMenu;
     const pads = [];
     const stickChips = [];
     let map;
@@ -433,14 +433,14 @@ export function mountUiShowcase(host, opts = {}) {
             text: { heading: "RÉSONANCE INSTABLE", prompt: "PÉDALE POUR CHARGER", deadlineLabel: "INSTABILITÉ", chargeLabel: "CHARGE", win: "CHARGÉE", lose: "TROP TARD" },
         });
     }
-    // --- the in-game pause menu -------------------------------------------
-    g.section("Pause menu (overlay)", "The GAME's own menu, opened in-game by OPTIONS (keyboard O, phone OPT, the pad's Menu/Options/+ button) — Resume is free, the game adds the rest. ▲▼ move, A picks, OPTIONS or B resumes, and a row can advertise the shortcut that does the same thing during play. Every word is in the GAME's font (inherited from the page — the second button forces one instead). With a real session it takes the controller over while it's up: the button monitor above goes quiet until you resume.");
+    // --- the in-game option menu -------------------------------------------
+    g.section("Option menu (overlay)", "The GAME's own menu, opened in-game by OPTIONS (keyboard O, phone OPT, the pad's Menu/Options/+ button) — Resume is free, the game adds the rest. ▲▼ move, A picks, OPTIONS or B resumes, and a row can advertise the shortcut that does the same thing during play, shown inline beside its label. Every word is in the HOST's font — inherited, so in a game it's the game's own face and here it's this page's; the second button forces one instead. With a real session it takes the controller over while it's up: the button monitor above goes quiet until you resume.");
     {
         const row = el(g.list, "div", "bs-btnrow");
         const status = el(g.list, "div", "bs-cap", " ");
         const launch = (title, items, font) => {
-            pause?.dispose();
-            pause = mountPauseMenu(document.body, {
+            optionMenu?.dispose();
+            optionMenu = mountOptionMenu(document.body, {
                 session,
                 title,
                 items,
@@ -448,14 +448,14 @@ export function mountUiShowcase(host, opts = {}) {
                 onOpen: () => { status.textContent = "Paused — the game would freeze its loop here."; },
                 onClose: () => { status.textContent = "Resumed."; },
             });
-            pause.open();
+            optionMenu.open();
         };
         const pick = (what) => () => { status.textContent = `Picked: ${what}`; };
         const mk = (label, run) => {
             const b = el(row, "button", "bs-btn", label);
             b.addEventListener("click", run);
         };
-        mk("Open pause menu", () => launch("Split Racing", [
+        mk("Open option menu", () => launch("Split Racing", [
             { label: "Restart", shortcut: "DIAMOND_UP", onSelect: pick("Restart") },
             { label: "Back to menu", onSelect: pick("Back to menu") },
         ]));
@@ -652,7 +652,7 @@ export function mountUiShowcase(host, opts = {}) {
             choice?.dispose();
             dialogue?.dispose();
             race?.dispose();
-            pause?.dispose();
+            optionMenu?.dispose();
             for (const c of rarityCards)
                 c.dispose();
             for (const p of pads)